jquery: option plus class and click

Question

Why does this script only work with Firefox? How can I get it to work with all browsers?

<script type="text/javascript">
$(document).ready(function(){   
    $(".radio_c").click(function(){
        alert('message');
    });
}); 
</script>

<select name = "list1">
    <option value="dog">dog</option>
    <option value="cat">cat</option>
    <option class="radio_c" value="car_bmw">bmw</option>
    <option class="radio_c" value="car_audi">audi</option>
</select>

i think there is something wrong with your code snippet. The html seems to be unrelated to the javascript — Andrey, Feb 22 '11 at 14:37
possible duplicate http://stackoverflow.com/questions/1926813/jquery-events-work-in-firefox-not-chrome — Adeel, Feb 22 '11 at 14:43

score 4 · Answer 1 · answered Feb 22 '11 at 14:38

4

You're triggering click on an option, this is not correct. You should instead have an onchange even on the select and then test the value of the selected option.

General example of what I'm saying:

$(document).ready(function(){   
    $("select").change(function(){
        if($(this).val() == "car_bmw") alert("blah");
    });
});

answered Feb 22 '11 at 14:38

marcgg

65,020
52
178
231

And if you want to simulate the original behaviour, you could use something like if($(this).find(':selected').hasClass('radio_c')) alert('blah'); – Capsule Feb 22 '11 at 14:47

score 0 · Answer 2 · answered Feb 22 '11 at 14:43

0

IE has no onClick event on an option you can only use the onChange event on the select http://api.jquery.com/change

answered Feb 22 '11 at 14:43

felixsigl

2,900
1
23
16

jquery: option plus class and click

2 Answers2

Linked