jQuery .change function onload

Question

I have a jQuery function that is triggered onchange like:

$(".option-image select").change(function()

The function changes an image based on a select drop down.

Now I'd like to manipulate the select on load and call the function so the image will change. I've tried with:

$(document).ready(function() {      
    $("#option-236").children("option[value='57']").prop('selected',true).change()
});

While that does change the select to the correct one, the image is not changed, making me believe that $(".option-image select").change(function()) is not triggered.

Is it possible to do?

Guffa · Accepted Answer · 2014-06-29 10:18:55Z

1

The change event only happens when the user selects an option, not when you do it with code.

You can trigger the event using the change method, it doubles as both setting the event and triggering the event. You trigger the event on the select element, not on the option element:

$("#option-236").change();

Side note: You only need to set an option as selected if you have a multi-select, otherwise you can just use the val method:

$("#option-236").val('57');

Then you can chain the methods:

$("#option-236").val('57').change();

answered Jun 29, 2014 at 10:18

Guffa

703k112 gold badges760 silver badges1k bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

jQuery .change function onload

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related