CODEWITHSUNDEEP
javascriptandroidjqueryhtml
Michael Marsh
Michael Marsh

Reputation: 593

Android JQuery focus() workaround

I'm working on an HTML5 mobile app (using regular jQuery, not mobile), which implements a custom autocomplete list that appears below a textarea. The user selects an option from the list, the word is autocompleted, and the user continues typing as usual.

The problem is that the user taps outside of the textbox to select an item from the autocomplete, so the textarea momentarily loses focus. Since focus() is deactivated in the android browser, I can't immediately re-focus and retain the caret's last position as I usually would.

Is there a workaround that would allow me to re-focus on a textarea, preserving caret position as regular blur() and focus() calls would?

Edit: Sources of underlying assumption: mentioned here: https://stackoverflow.com/a/10243010/832607 and here: http://ambrusmartin.wordpress.com/2012/08/30/soft-keyboards-in-android-iphone-phonegap-applications-when-we-call-focus/ (Already tried solution mentioned in link)

Upvotes: 3

Views: 1129

Answers (1)

Patrick Rudolph
Patrick Rudolph

Reputation: 2241

Instead re-focusing the textarea I'd recommend trying to not lose the focus in the first place. I'm achieving this when preventing the default action on mousedown.

Here is the jQuery, assuming list is your list of options and all options have listEl class:

list.on('mousedown', '.listEl', function(e) { 
  e.preventDefault(); 
});

Upvotes: 1

Related Questions