JQuery change-and-then-blur event

Question

We have one of those scenarios where you prefer the event to fire only when you exit the input field. This is because the event results in a “postback” such as an ajax request, which in turn updates the input fields. The change event will start an endless loop.

On the other hand, a blur event is fired each time the user leaves the field, regardless of whether the field has been changed or not.

What I'm looking for is a kind of "change-and-then-blur" event, which fires if the field has changed, but only when it remains (blurred).

I believe jQuery does not have this out of the box. Is there an easy way to expand it for this?

Update. I just tried to reproduce the infinite loop problem in a simple jsfiddle - to no avail.

Knockout is involved here, as well as jQuery autoNumeric and custom knockout autoNumeric binding. Values ​​are updated using ko.mapping. But even with all of these jsfiddle turned on, it seems to work just fine with a simple jQuery event change: http://jsfiddle.net/a1tbxnpp/

So, I think I would rather investigate the problem with my application to worry about introducing another jQuery event.

Answer 1

. . , ajax.

Answer 2

... , , , :

$(":input").each(function() {
    var $el = $(this),
        oldValue = $el.val();

    $el.focus(function() {
        oldValue = $el.val();
    });

    $el.blur(function() {
        var newValue = $el.val();
        if (oldValue != newValue) {
            $el.trigger('changeblur');
        }
    });
});

, , ...