レビュー機能　ブラウザバックしたら星が増えるバグ解決方法

こんにちは。

先日引越しの準備をしていたら、授業中に友達と手紙交換していた手紙と遭遇。

見返してたらいつの間にか２時間過ぎてました。（笑）

どうでもいい事書いてあった中に真面目な手紙が１通。

「自分から明るさ出して行こうや！」by友達

それでは、今日の本題に入って行きます。

開発環境

Windows10

Cloud9

Ruby2.6.3

Rails6.1.4

raty.jsを使用してレビュー機能実装済み

バグの現状

viewでの表示

投稿一覧→　評価：★★★★★　星５つ

ブラウザバックしたら→　評価：★★★★★★★★★★　星が増えてる

 解決方法

scriptタグに$('').empty();を追加する

例.

<script>

　$('#star').empty();　←これ追加

　$('#star').raty({ &nbsp;&nbsp;&nbsp;size : 20,

　　starOff: '<%= asset_path('star-off.png') %>',

　　starOn : '<%= asset_path('star-on.png') %>',

　　scoreName: 'post[difficulty]',

　　half: false, &nbsp;&nbsp;});

</script> 

$('#star').empty();が無いと、以下の事が起こります。

星が５つ表示される

↓

他のページに遷移する

↓

ブラウザバックする

↓

星５つが読み込まれたに再度星が５つが読み込まれます。（合計１０　星が増える）

ペーに遷移して再度ブラウザバックしたら、星が５つ読み込まれ、

星がどんどん増えていきます。

なので、emptyメソッドを使って、一旦子要素を削除する

そうすることで上記のバグが解決します。

emptyとは？

指定した要素の子要素を削除

指定した要素自体は削除されない

※星部分を一度削除して再度読み込む

（子要素が削除されるだけで、要素自体は削除されていないです）

お疲れ様でした。

何か間違いがありましたら、ご指摘宜しくお願い致します。