jquery - 選択オプションでクリックイベントをバインド

Question

clickHTMLoption要素のイベントを機能させるのに問題があります。

単純なものでも機能しconsole.log('hello!');ません。

私はこれで試しています：

$('#mySelect option').bind('click', function(){
  console.log('hi!');
});

しばらくは動作しましたが、その後停止しました。

Answer 1

私の場合、次のコードが機能します

$('#myItem').change(function(){
            //do somthing
})

Answer 2

idを指定してを使用.on()してバインドできます。<select>一般的に、changeは呼び出されるイベント<select>です。

optionしたがって、イベントをバインドするときに言及する必要はありません。

$(document).on('change','#mySelect', function(){<br>
    console.log('hi!');
});

また

$('#mySelect').bind('change',function(){<br>
    console.log('hi!');
});

Answer 3

これにより、ケースが解決されます-私のニーズに合わせて（ページの選択要素の一部がクリックされたときにイベントをキャッチするため）。タッチ動作を検証していませんが、Firefox、Chromeはこれで問題ないようです

$('.class_for_select').focus(function() {
    // do something here
});

Answer 4

サンプル例は、クリックまたは選択の変更時にオプションのドロップダウン値と色を変更する方法を示しています

HTML：

<select name="options">
      <option value="1">Red</option>
      <option value="2" selected="1">Green</option>
      <option value="3">Blue</option>
</select>

jQuery：

$("select").on("click", function () {
    debugger;
    var sVal = $(this).val();
    $(this).css("background-color", "red");
    $(this).find("option").css("background", "white");
    $(this).find('option:selected').css("background-color", "red");
    $("input").val($(this).val());
});

デモ

Answer 5

このjsフィドルを確認してください-

http://jsfiddle.net/4W826/

HTML

<select id="mySelect">
               <option value="volvo">Volvo</option>
               <option value="saab">Saab</option>
               <option value="mercedes">Mercedes</option>
               <option value="audi">Audi</option>
       </select>  

JQUERY

$('#mySelect').bind('click', function(){
alert('hi!');
});

Clickからに変更Change

Answer 6

.bind（）の代わりに.on（）を使用することをお勧めします。

$('#mySelect').on('change', function(){
  var $this = $(this),
      $value = $this.val();

  alert($value);

});

jsFiddle

Answer 7

変更が私にとって十分ではなく、オプションをクリックする方法が見つからなかったためです。

 $('#mySelect').click(function () {
        if ($(this).attr('optionclick') == '1') {
             $(this).attr('optionclick', '0');
        }
        else {
             $(this).attr('optionclick', '1');
        }
  });