J'écris une petite application web qui fait un usage intensif de l'élément canvas pour faire quelque chose de similaire à VNC. Il est particulièrement ciblé pour les navigateurs par défaut d'iOS et d'Android.Comment faire pour obtenir les navigateurs mobiles (webkit dans iOS, Android) pour afficher leurs soft-claviers
Je peux détecter via les appels AJAX lorsque la saisie au clavier est requise, mais j'ai du mal à convaincre les navigateurs mobiles d'afficher leurs claviers souples à la demande. Ma pensée était d'avoir un champ de saisie, peut-être se cachant derrière la toile, sur lequel je pourrais me concentrer lorsque cela est approprié, puis d'écouter les événements clés sur ce champ de saisie. Le problème est que cela ne semble pas fonctionner quand il vient «de l'arrière-plan», c'est-à-dire sur le gestionnaire de succès d'un appel AJAX. Voici un cas de test autonome (nécessite jQuery, et utilise un gestionnaire ajax fictif monté à /focus) qui montre comment le focus n'apparaît pas sur le clavier du navigateur mobile lorsqu'il provient d'un délai setTimeout ou du retour d'un Appel AJAX. Est-il possible de faire apparaître le clavier de manière efficace?
<html>
<head>
<title>Focus Test V1</title>
</head>
<script type="text/javascript" src="jquery.js"></script>
<body>
<div>
<form method="GET" onsubmit='return false;'>
<input type="text" id="kb" />
</form>
</div>
<div>
<button id="focus-direct">Focus Directly</button>
<button id="focus-timeout"">Focus Timeout</button>
<button id="focus-ajax">Focus Ajax</button>
<button id="clear">Clear</button>
</div>
<div id="console"></div>
<script type="text/javascript">
function init() {
function append(text) {
$('<div/>').text(text).appendTo('#console');
}
$('#clear').click(function() {
$('#console').html("");
});
$('#focus-direct').click(function() {
focusKB();
});
$('#focus-timeout').click(function() {
setTimeout(focusKB(), 50);
});
$('#focus-ajax').click(function() {
append("sending...");
$.ajax({
url : '/focus',
success : function() {
append("ajax returned...");
focusKB();
}
});
});
function focusKB() {
$('#kb').focus();
append("focusing...");
}
setTimeout(focusKB, 3000);
}
$(document).ready(init);
</script>
</body>
</html>
C'est ce que mes expériences semblaient suggérer, mais j'espérais une bonne astuce pour contourner ce problème. – CarlG