Which 'event' should I use with an <input/> element on an iOS/Android?

Question

I need to show/hide results when a user starts to type in the search field of an input element.

Some interesting events I can use would be

• mousedown / mouseup
• touchstart / touchend
• focus

or perhaps ignore the "click" event altogether and just use the "change" event to 1. detect if text is present in the search box, 2. respond accordingly.

Since there are potentially many nuances specifically across devices which I don't own and can't test, I'm hoping someone can tell me which event I should be using to handle this scenario.

*- Note - the demo requires manual editing of the following until the proper event is configured

 $("#local-filterable-listview").hide();
 $("#defaultHomeContent").hide();

Answer 1

It seems like it really depends on what you want the exact behavior to be. If you want to trigger an action when the user first engages with the field, then you'd want to trigger based on:

touchstart
mousedown
focus

If you want to trigger only when content is changed in the field, you can respond to:

input

If you also want to support IE before IE9 (which doesn't support the input event, then you may also want to trigger based on:

keyup
drop