jquery mettre l'accent sur le contenu dynamique?

Question

jquery J'ai ajouté un élément <li> à une liste non ordonnée.

Comment puis-je me concentrer sur le <li> nouvellement créé?

Si je fais ce qui suit:

$("ul").append('<li><input type="text" value="Hi!"></li>'); 
$("li:last").focus(); //doesn't work because new <li> isn't in dom yet 

la mise au point ne fonctionne pas, comme il est indiqué ci-dessus.

Je sais jquery a un 1.4.2 gestionnaire d'événements live() qui vous permet de charger des gestionnaires d'événements aux éléments ajoutés dynamiquement, mais je ne sais pas ce que je fais mal:

$(document).ready(function() { 

    $('li').live('load', function() { 
     alert("hi!"); 
     $("li:last").focus(); 
    }); 
}); 

Answer 1

Vous ne pouvez définir l'accent sur les éléments qui peuvent retenir l'attention. Par défaut, un élément de liste ne peut pas. Voilà pourquoi votre premier exemple échoue, non pas parce qu'il est pas dans les DOM (il est dans les DOM, c'est-ce append fait)

En général, vous devez utiliser des éléments conçus pour maintenir la mise au point (c.-à-mettre l'accent sur l'entrée et non sur l'élément de la liste). Vous pouvez également (mais cela est moins rétrocompatible et moins logique) utiliser le tabindex du HTML5 (en le configurant probablement sur 0).

onload ne fonctionnera pas car les éléments de la liste ne chargent pas le contenu externe.

Answer 2

Vous pouvez essayer ceci, $(YourElement).trigger("focus").

Answer 3

Il s'agit d'un ancien article que je connais, mais un moyen simple de résoudre ce problème consiste à créer une entrée de texte dans votre code HTML et à définir son CSS sur "display: none;". Dans l'événement click de LI, définissez le focus dans cette entrée et écoutez ses événements de pression de touche. Je l'ai fait et ça fonctionne comme un charme.