click event for option doesn't work in IE

Question

I have a multiple select tag, and I need to write the function onclick of it\'s options, because I need to get the value of last clicked option, but when I wrote the followi

Answer 1

don't bind it on option

$("#multiple_select").click(function(){
     alert("works");
});

---

accepted answer:

$(document).ready(function()
{
    var options = $("#supply_cities_select :selected");
    var lastOption;
    $("#supply_cities_select").click(function()
        {
            lastOption = $(this).find(':selected').not(options);
            options = $(this).find(':selected');
        })
});

Answer 2

Use JQuery focus() on option, rather than click().

Happy Coding.

Answer 3

Ok, here's some IE weirdness:

Using IE, in the click event function, event.srcElement.value gives the value of the last clicked option.

Try this: http://jsfiddle.net/Ch2DT/ (only tested in IE8, needs work to make it cross browser)

Answer 4

$("#multiple_select").click(function(){
  alert($(this).children("option:selected").val());
});

should to the thing

Answer 5

<select id="multiple_select" size="4">
    <option value="1">One</option>
    <option value="2">Two</option>
    <option value="3">Three</option>
    <option value="4">Four</option>
</select>

<script src="Scripts/jquery-1.4.1-vsdoc.js" type="text/javascript"></script>
<script type="text/javascript">

    $(document).ready(function() {
        $('#multiple_select').click(function() {
            alert($(this).val());
        });
    });

</script>

The alert window, depending on the choice you made, shows the selected value.

Answer 6

I liked @Reigel's (accepted) answer but needed to improve it for use in one of my projects. In the code below, I introduce a new function "findClickedOption" that accounts for the fact that maybe a user will re-click an already-selected option. This still doesn't account for CTRL-clicking multiple options but is good enough for me.

    var multiselect_s=$('#ms2side__sx');
    var options_s =multiselect_s.find('option:selected');
    multiselect_s.live('click',function(){
      var clickedOption =findClickedOption($(this), options_s);
      options_s = $(this).find('option:selected');
      doSomething(clickedOption);//call your own function here
    });

    function findClickedOption(selectbox, optionsArr){
      var selectedOptions=selectbox.find('option:selected');
      if(selectedOptions.size>1){
        return selectedOptions.not(optionsArr);        
      }else{
        return selectedOptions;
      }
    }