Question

I’m working on a form that calls a function whenever the value of a text field changes. It uses the “keyup” and “change” events for this. But if a user double-clicks the text field and then clicks on an item in their browser’s built-in list of previously entered values, the function doesn’t get called. The user has to click outside of the text field after that in order for the “change” event to be triggered. Any ideas?

Answer 1

You can listen for focus and blur events on the input like so:

function monitor() {
 console.log($('#input').val()); // Log the value (or trigger your chnage)
}

var timer = '';

$('#input').on('focus', function() {
  timer = setInterval(monitor, 100);
}).on('blur', function() {
  clearInterval(timer);
});

Here’s a working jsFiddle.