2010-11-06 9 views
3

Étrange problème. J'ai le code suivant:jQuery append() ne fonctionne que la première fois

// remove template row from DOM and store in variable 

var $addDegreeRow = $('.addDegreeRow').remove(); 
$('#addDegreeLink').click(function (ev) { 
    ev.preventDefault(); 
    $('.degreeSection').append($addDegreeRow); 
}); 

je sélectionne un élément du DOM, retirer et préserver son contenu dans un sélecteur $addDegreeRow. Ensuite, j'assigne un événement click à un lien sur la page qui ajoute le sélecteur stocké à un div existant sur la page.

La première fois que je passe à travers l'événement click tout fonctionne parfaitement. Mais la deuxième fois par le biais de rien est ajouté. Et si je regarde le HTML dans firebug, le div .degreeSection est surligné chaque fois que j'effectue le clic, même si rien d'autre n'est ajouté. C'est comme si jQuery écrasait le vieux $addDegreeRow avec le nouveau, au lieu d'en ajouter un autre.

Quelqu'un a-t-il déjà rencontré ce problème? Merci.

Répondre

11

Vous ajoutez le même élément encore et encore. Si vous voulez une copie de cet élément, vous devez d'abord le cloner().

+1

donc '.append ($ addDegreeRow.clone())'? –

+0

Ah! Tu as raison, ça a marché. Merci. –

+0

@Mega Matt, si cette réponse a fonctionné pour vous, et a été utile, vous pourriez peut-être envisager de l'accepter? –