Select element and jQuery CHANGE event in IE8?

问题:

I have a small script on my site that calculates a price quote based on the options chosen in 4 different Select elements. The price quote is written into a div and is updated each time there is any change in the selected options.

Here is the link to this page: http://www.justaddsolutions.com/justaddwebsite/prices/

I used jQuery CHANGE event handler to trigger the calculating function each time there is a change in my Select elements, like this:

jQuery("#pages").change(price_quoter);

And here is my HTML code that goes with it:

<select id="pages" class="instant_quote" name="pages"> 
<option value="1">1 page</option>
<option value="2">2 pages</option>

This works fine in Safari and Chrome, but doesn't work in IE8. In IE8 the change in Select elements doesn't trigger the calculating function.

I researched this issue and got contrary data - some say that Change jQuery event doesn't work in IE8 and some say it does.

I then thought to use the onChange function of JS, but also read that it is not supported by IE8.

Could you help with figuring out the way to do it that works in all browsers.

回答1:

In my experience the 'change' event in jQuery does work in IE8 for select lists, perhaps there is another bug in your code that is causing the issue?

回答2:

try this

$("#pages").on("keyup change", function () {
    // let's make sure the event is not the problem , could be a problem with price_quoter? 
    alert("yay!! pages was changed");
    // call your function
    price_quoter();
    // do stuff here
});

if you're using an old version of jquery, you might need to use "bind" instead of "on"

$("#pages").bind("keyup change", function () {
    // let's make sure the event is not the problem , could be a problem with price_quoter? 
    alert("yay!! pages was changed");
    // call your function
    price_quoter();
    // do stuff here
});

回答3:

Try using the $("select option").click() event handler instead.