質問: jQueryでコミュニティ参加脱退処理の実装をしています。 参加ボタン押下時は脱退ボタンに切り替わり、 脱退ボタン押下時はモーダルを表示し、「脱退します」を選択すると参加ボタンに切り替わります。 withdrawクラスを付けたり外したりするとボタンの色が変わります。 その要件を以下のように実装しました。 動きとしては想い通りに動いているのですが、懸念点が2点あります。 質問の内容としては、次の2つの懸念点を解消するにはどのように実装すればいいでしょうか? 懸念点は以下 1.「$('.box1').on('click','.box2',function(){...」を参加の時も脱退の時も実行してしまう。 →参加ボタンを押した時だけにしたい 2.onが複数登録されてしまう気がする。 →複数登録されないようにしたい この2点を解消したいです。もしアドバイスが頂ける方がいればよろしくお願い致します。 ``` Insert title here 参加 コミュニティから脱退しますか? ```
回答: 1.「$('.box1').on('click','.box2',function(){...」を参加の時も脱退の時も実行してしまう。 →参加ボタンを押した時だけにしたい ↑ クリックされた時にwithdrawクラスが存在しているかどうかを判定し、存在していない場合にのみ、登録の処理を走らせれば良いと思います。 2.onが複数登録されてしまう気がする。 →複数登録されないようにしたい ↑ 普通に.box1にクリックイベントを紐付けるだけにすれば良いのでは?