web-dev-qa-db-fra.com

jQuery Focus échoue sur firefox

J'ai fait quelques essais de recherche pour cette autre question , quand j'ai remarqué quelque chose de très particulier. FF4/5 ne parvient pas à déclencher l'événement focus jQuery. L’autre question qui pourrait être considérée comme un duplicata a été clôturée et acceptée sans véritable réponse.

Pour la question elle-même, j'ai essayé le morceau de code simple suivant:

$('#target').focusout(function() {
    $(this).focus();
});

Cela fonctionne bien dans Chrome et dans IE, mais il échoue avec FF. Voici lejsFiddlepour les plus fainéants parmi nous.

Quelqu'un peut-il expliquer ce comportement? Ou est-ce un bug connu?

jqueryfirefox
23
Madara Uchiha

Je pense avoir déjà rencontré cela auparavant, et si je me souviens bien, cela semblait être une sorte de problème de réentrance. Mon impression était que, comme FF est déjà en train de faire la transition d'un focus, cela ne vous laissera pas initier une autre transition de focus. Je crois que ma solution de contournement était quelque chose comme

$('#target').focusout(function() {
    setTimeout(function() {
        $(this).focus();
    }, 0);
});
48
chaos

Le manuel dit aboult .focus() call

Cette méthode est un raccourci pour .trigger ('focus')

et de la .trigger() topic

Bien que .trigger () simule l'activation d'un événement avec un objet événement synthétisé, il ne réplique pas parfaitement un événement naturel.

Donc, si je comprends bien, l'appel $(this).focus(); est supposé déclencher l'événement OnFocus (s'il y en a un attaché à l'objet) mais n'est pas garanti pour réellement définir/modifier l'objet focalisé.

3
ain

Cela fonctionnait pour moi dans Firefox 38. Je devais tester différents délais ms. Merci au commentaire @camaleo.

$(document).ready(function() {
setTimeout(function() { $('#myid').focus(); }, 100);
});
0
daniel

Le focus semble fonctionner maintenant dans le dernier Firefox, sans la nécessité de la fonction setTimeout.

Si vous souhaitez également sélectionner le champ de saisie, vous devez utiliser la fonction .select () bien que document.execCommand ('SelectAll'); ne semble pas fonctionner sur Firefox non plus. 

Donc, après avoir sélectionné le champ de saisie, puis sélectionné, vous pouvez le copier ou faire ce que vous voulez.

Dans mon cas d'utilisation, je devais copier l'URL du champ de saisie si quelqu'un appuyait sur le bouton de copie:

$(".copyURL").click(function(){ 
    $(this).prev().focus().select();
    document.execCommand("Copy",false,null);
});

J'espère que cela pourrait aider tous ceux qui recherchent ce problème!

0
Rafaël De Jongh