Jquery Change Event Called Two Times

Javascript - Change event trigger multiple times

I ended up using this solution

$(document).on('change', '.invoice-item-select', function(e) {
    if (e.handled !== true) {
        e.handled = true;
        return;
    }
    // Code here
});

Although this does not stop from multiple firing of events, I can at-least stop the code execution for subsequent triggers.

jQuery change event being called twice

All I can think of is that you used the same class on the form itself. if so, remove the myClass style from your form tag.

Corrected :
http://jsfiddle.net/rY6Gq/1/

Faulty one with double alert:
http://jsfiddle.net/rY6Gq/

Why does jQuery on change event fire multiple times?

The reason is because you are nesting your event handlers. You've placed a static event handler within a delegated one, so each time an event happens another handler is added. This is also the reason why nothing happens when you first select an option.

To fix the problem simply remove the inner static event handler:

$(document).on('change', '.gender-select', function() {
  console.log($(this).find("option:selected").text());
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<select class="gender-select">
  <option value="">- Select Gender -</option>
  <option value="m">Male</option>
  <option value="f">Female</option>
</select>

jQuery change event being fired twice

Problem is my bootstrap datepicker change event fire two times. The trick is to use changeDate instead of change.

$('.start_date').on("changeDate", function() {

});

jQuery on change trigger twice on select

You have two classes .select-car

<div class="row select-car">

and in

<select name="cartype" class="form-control select-car">

Which is causing this to be called twice. And hence binded the change event twice.

jQuery onChange event handler firing function twice

The reason why it's firing twice is because your on change element fires for every class with the name item. If you look through your code you can see that on top of giving every table column the class item, you are also passing the item class to each row that is added. So the event fires twice, once for the row and once for the item column.

The code that's giving you the problem is

prot.attr("class", id + " item")

Try to fix your problem by not passing the item class to the table rows, instead of doing all kinds of hacky stuff to the event listener.

You could build your code to something along the lines of

prot.attr("class", "item-" + id)

jQuery radio button on change function runs twice

This really shouldn't be happening and without your code we really can't say for sure what the issue is, but rather than working with the change event, you can use the click event.

It may be that there is other code in your application that causes your change callback to be firing twice.