CODEWITHSUNDEEP
javascriptjqueryjquery-events
Myobis
Myobis

Reputation: 1357

jQuery event upon selection of a suggested item on a text box?

I'd like to run a function upon each modification of a textbox control as soon as the user is typing. the event .keyup() is fine for most of the cases.

However, browsers (like Chrome or Firefox) may suggest autocompletion entries for textbox controls (probably because the @name or @id of the input control is known).

Unfortunately, I can't have any of the below events fired when "clicking on a suggested entry". ( .keyup() fires when selected with keyboard )

$('input#email')
  .click(function() { console.log('click'); })
  .keyup(function() { console.log('keyup'); })
  .keydown(function() { console.log('keydown'); })
  .change(function() { console.log('change'); })
  .focus(function() { console.log('focus'); })
  .blur(function() { console.log('blur'); });

As much as possible, I'd like to avoid using a setInterval() periodical check.

Is there a way to detect this "select a suggestion" event ?

Upvotes: 11

Views: 3608

Answers (4)

Hassan Saeed
Hassan Saeed

Reputation: 7080

alternative solution disable autocomplete and handle other events like keyup,keydown etc

<input type="text" name="foo" autocomplete="off" />

Upvotes: 3

Graham
Graham

Reputation: 6562

The short answer is no, there is no event for detecting a suggestion selection. You could try looking at DOM mutation observers but I'm uncertain if these cover attribute changes, and there is little support for this API so far anyway.

So if you really need to handle this case then I think setInterval is your only option.

Edit: 3 years later you can use propertychange with jQuery as in the new accepted answer (which I assume uses mutation observers under the hood).

Upvotes: 5

devops
devops

Reputation: 9179

bind propertychange event:

$('input').bind('input propertychange', function() { 

    var input = this.value.trim();
    [...]   

});

Upvotes: 12

sflitman
sflitman

Reputation: 111

The change event seems to works fine, but does require you to click away

Upvotes: 0

Related Questions