Detect an event on jQuery - On change with no click

Question

I wonder if any function exist which allows to make the equivalent of the onChange event but with no click.

Do you know if that function exists?

For example I have a <ul> list which i can click on every <li> .

<ul>
    <li value="1">val 1</li>
    <li value="2">val 2</li>
    <li value="3">val 3</li>
</ul>

And this previous list updates my Select list and selects the new Option

<select>
    <option value="1">val 1</option>
    <option value="2">val 2</option>
    <option value="3">val 3</option>
</select>

So I must make an event which detects which new value has been selected BUT with no click.

Have you got an idea ? Thanks in advance for your answer !

Answer 1

Try this:

$(yourElement).trigger('change');

All this does is fake a change event on your element so if anything is listening for it, it will react accordingly - is that what you mean?

Answer 2

Just use jQuery's .change() event. This gets called every time the select changed whether its with the keyboard, mouse or other.

$(document).ready(function() {
  $( "select" ).change(function() {
    alert( "Handler for .change() called." );
  });
});

Check out the jsFiddle

More Information

• jQuery Documentation - .change()

Answer 3

To trigger the OnChange event on your select simply do after the document loaded:

$(document).ready(function() {
    $("select").change();
});