Chin
Chin

Reputation: 613

Identify select option change (change, onchange, click) event through JavaScript or jQuery

Is there any way to know when the select option is changed through event other than onchange in the select?

For example, through jQuery.

    $('select').val('2');
    $('#someButton').click(function() { $('select').val('2');});

Meaning that if I change the select value by click on the button, I may be prompted a message. But when I change the select value by choosing option from the select, I won't be prompted a message.

Instead of setting a timer scanning the page every single single to check for any select value changed (which will heavily bring down the performance), is there any other ways?

Upvotes: 1

Views: 2441

Answers (1)

adeneo
adeneo

Reputation: 318342

Well, say you had an event handler

$('select').on('change', function() {
    alert('change triggered !');
});

that event handler wouldn't be triggered by changing the value programatically, only a user action would trigger that handler, unless it's specifically triggered, meaning we have to do this

$('select').val('2').trigger('change');

and that gives us the ability to check if the event was fired by a user action or was triggered programatically, by doing

$('select').on('change', function(e) {

    if ( e.isTrigger ) {
        alert('change triggered programatically !');
    } else {
        alert('change triggered by user !');
    }
});

FIDDLE

Upvotes: 4

Related Questions