jquery Créer des travées puis leur appliquer des fonctions

Question

Je crée un formulaire dans jQuery. Lorsque la page est chargée, je cache toutes les zones de texte et j'essaie de les remplacer par un espace.

$("form input:text").each(function(index) { 
    $(this).after("<span id='Span_" + $(this).attr("id") + "'>" + $(this).val() + "</span").hide(); 
}); 

Cela passe par chaque entrée de texte place une travée après la zone de texte avec un identifiant identique à la zone de texte, mais « span_ » appened au début ..

Maintenant, je veux appliquer en vol stationnaire sur les portées : $ (« span ») vol stationnaire

Je suppose que je pourrais le faire à l'intérieur du chacun ou essayer de l'appliquer après (quand tous ont été créés) mais je ne suis pas sûr de savoir comment s'y prendre pour le faire fonctionner

.

Answer 1

Vous pouvez changer autour d'un peu comme ceci:

$("form input:text").each(function(index) { 
    $("<span />", { "id": 'Span_' + this.id, text: $(this).val() }) 
    .insertAfter(this) 
    .hover(function() { 
     //do something 
    }); 
    $(this).hide(); 
}); 

Il utilise $(html, props) pour créer l'objet, et au lieu de .after() utilise .insertAfter(), cette façon, votre chaîne se réfère à l'élément créé, de sorte que vous pouvez faire tout ce que vous voulez directement.

Answer 2

Puisque vous êtes juste en train de les cacher et de ne pas les détacher, cela devrait faire l'affaire:

$("form input:text").each(function(index) { 
    $(this).after("<span id='Span_" + $(this).attr("id") + "'>" + $(this).val() + "</span>").hide(); 
}); 
$("form input:text+span").hover(...); 

Une autre alternative est d'utiliser $(this).next().hover() dans la boucle, après avoir ajouté l'élément, comme ceci:

$("form input:text").each(function(index) { 
    $(this).after("<span id='Span_" + $(this).attr("id") + "'>" + $(this).val() + "</span>").hide().next().hover(...); 
}); 

C'est probablement une meilleure solution, puisque vous arrivez à lier les événements individuellement. Il ajoute des calculs inutiles si vous n'avez pas besoin de lier individuellement.