質問: ### まずはコードをご覧ください ``` 0 1 2 3 4 ``` ### やりたい事、試したこと これをブラウザで表示し、の値が変わった時のイベントを拾いたいときには ``` $("#select0").on("change", function() { // 処理 }); ``` で良いと思うのですが、ユーザが迷った挙げ句、値が変わらなかった、同じ値を選んだ時には処理は働かないですよね? 値が変わっても変わらなくても同じようにイベントを拾いたいのですが、 ``` $("#select0").on("click", function() { // 処理 }); ``` としてしまうとを触った瞬間処理が実行されてしまいます。 ### 質問 を値(option)が変わったかどうかにかかわらずどれかを選び終わった時のイベントの拾い方を教えてください。 ### 補足 2018.7.19 20:39 質問を上手く単純化出来なくてお伝えできなかった感があるのと教えていただいたことを消化しきれていないのとあって、自分の中で考え直しているところです。 整理できたらお答えするなり補足質問させていただくなりします。 ### 追加 2018.7.19 20:55 ``` やりたいのは値が変わっても変わらなくても選ばれた瞬間処理が走ることです 実際は 値が変わると消えます 0 1 2 3 4 ``` ソースのままで申し訳ないのですが、これが一番伝わりやすいかと思いまして。意図、伝わりますでしょうか?
回答: 追記いただいているコードでそのまま考えてみます。 初期で最初のオプション(value="0")が選択されているので それを再選択したときに`.hiddenable`を消したいとするとonChangeでは無理ですよね。 考え方を変えてオプションの一番最初に `選択してください` を入れるという方法では実現できなそうですか? サンプル この場合、仮にオプションがバックエンドで何かしらの値が選択された状態でHTMLが作成され、 同じものを選択したときにも何かしらの処理がしたいという場合は対応できませんね。 どうしてもというなら、ご質問の意図とは違うと思いますがセレクトボックスっぽいものを自作してみるのも一つだと思います。 HTMLはこんな感じでしょうか?(css,jsは別途必要です) ``` 0 1 2 3 4 ``` この場合`.my-option`にクリックイベントつければすべてのオプションにイベントを付けることができます。 実際は表示位置によって上に出すか下に出すかとか、オプション以外のところがクリックされたらオプション閉じないといけないとか、まぁまぁ大変だと思いますが勉強になると思います。