Question

I'm using jQuery 1.7.2 and got an on change event for a class like this:

$(document).on('change', '.item_amount', function(){

});

Many selects on the same page have that class and if I change one of those selects the change event triggers X times if I change one of those selects(X is the amount of selects having that class) but I only want it to trigger once since only one select has changed.

Is that normal behaviour or am I doing something wrong?

Edit:

The problem seems to be somewhere else. The elements containing that select get inserted(Ajax call) and when one of them gets inserted into the dom, the change event is triggered for all existing elements.

So basically I got select number 1 which holds some products. When a product is selected HTML code is inserted into a div which holds all current products. When that happens the change event on all products in that div is triggered.

Was it helpful?

Solution

Use this keyword to refer to the current element changed in the change function block.

this --> JavaScript or Native Dom Element.

$(this) ->Your jQuery Object

$(document).on('change', '.item_amount', function(){
    alert(this.value);
    console.log(this);
});

OTHER TIPS

Set the. on change to the element and pass it as an argument to the function?

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top