I want to listen for the onfocus
-event of an HTML <select>
dropdown box. The onfocus
event is triggered in every browser except in the native Android browser (tested using Android 1.6 and Android 2.3.3).
I created the following code to demonstrate my issue:
<html>
<body>
<form>
<select onfocus='$("#info").html("you got the focus!")'>
<option>1</option>
<option>2</option>
<option>3</option>
</select>
<span id="info">No focus currently...</span>
</form>
</body>
</html>
ā You can also see this on jsfiddle.
As said, this is working in every browser (tested using current versions of Chrome, Firefox and Internet Explorer), but not in the native Android browser. It is also working on mobile Safari on iPhone 3GS. Anyway, the onfocus
event works on <input>
elements on all browsers, also on Android native browser.
How can I make the onfocus
event working on <select>
elements in the Android browser?
This jQuery code does the trick for me now on Android devices
$(document).ready(function(){
$("#select").bind('mouseenter', function(event) {
$(this).focus();
});
$("#select").bind('mouseleave', function(event) {
$(this).blur();
});
});ā
Basically, mouseenter
and mouseleave
events are triggered on Android devices. I found this out by logging all events which are triggered on the select
element.
The good thing is, that I still can use the onfocus
event in my select
element. The disadvantage is that this code must only be executed on Android devices.