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, becouse i need to get the value of last clicked option, but when i wrote the following

$("#multiple_select option").click(function()
{
     var val = $(this).val();
     alert(val);
});

it doesn't work in IE.

Whant is the problem?

Thanks

UPDATE

i need exactly click event, because i wrote a fuction onclick event allready(demo here), and i need to fix last changed element's value, which is inpossible to make without click event(i think)

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

If you really want to have a click event on each option, you need to have List instead of a dropdown style.

To accomplish that, add the size attribute into the select element for instance:

<select type="multiple" size=4>
  <option>foo</option>
  <option>bar</option>
  <option>baseball</option>
</select>​​​​​​​​​​​​​​​​​​​​​​​​​

Now you can bind each option individually.

If you want to get the value of a clicked option use the change event handler and .val() method, like:

$("#multiple_select").change(function() {
  var val = $(this).val();
  alert(val);
});

Answer 3

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

should to the thing

Answer 4

<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 5

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

Happy Coding.

Answer 6

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)