Dans Mobile Safari, je ne parviens pas à me concentrer sur un champ de texte après avoir défini un délai. Je joins un exemple de code illustrant le problème. Si, en cliquant sur le bouton, vous déclenchez .focus(), tout fonctionne comme prévu. Si vous suspendez le focus à un callback, comme la fonction setTimeout, cela échoue UNIQUEMENT dans Safari mobile. Dans tous les autres navigateurs, il y a un délai, puis le focus se produit.
De façon déroutante, l'événement "focusin" est déclenché, même dans safari mobile. Ceci (et des commentaires similaires dans SO) me font penser qu'il s'agit d'un bug de mobile safari. Tout conseil sera accepté.
J'ai testé dans l'émulateur, et sur l'iPhone 3GS/4 iOS4.
Exemple HTML :
<!DOCTYPE html>
<html lang='en'>
<head>
<title>Autofocus tests</title>
<meta content='width=device-width, initial-scale=1.0, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0' name='viewport'>
<meta content='yes' name='apple-mobile-web-app-capable'>
</head>
<body>
<h1>
Show keyboard without user focus and select text:
</h1>
<p>
<button id='focus-test-button'>
Should focus on input when you click me after .5 second
</button>
<input id='focus-test-input' type='number' value='20'>
</p>
<script type="text/javascript">
//<![CDATA[
var button = document.getElementById('focus-test-button');
var input = document.getElementById('focus-test-input');
input.addEventListener('focusin', function(event) {
console.log('focus');
console.log(event);
});
button.addEventListener('click', function() {
// *** If triggered immediately - functionality occurs as expected
// input.focus();
// *** If called by callback - triggers the focusin event, but does not bring up keyboard or cursor
var t = setTimeout("input.focus();",500);
});
//]]>
</script>
</body>
</html>
~Des questions similaires :