2009-02-13 9 views
2

J'utilise mootools pour basculer l'affichage (et l'existence) de deux éléments DOM dans une de mes formes. Ensuite, j'utilise javascript pour valider le formulaire afin de m'assurer que tous les champs requis ont été remplis. Le problème est que le navigateur semble mettre en cache les éléments. Par exemple, je html comme ceci:Est-ce que javascript cache les éléments DOM?

<input name="inputbox" id="inputbox" type="text" /> 
<select name="selection" id="selection">...</select> 

Et le javascript pour la validation est quelque chose comme ceci:

if (form.inputbox != null && form.inputbox.value == "") { 
    //don't submit form 
{ 
else if (form.selection != null && form.selection.value == 0) { 
    //don't submit form 
} 

Maintenant, cela fonctionne très bien lorsque la page est d'abord chargé et l'élément input a été enlevé. Cependant, lorsque je clique sur le bouton qui remplace l'élément input par l'élément select, à partir de ce moment-là les form.inputbox et form.selection dans le code javascript contiennent l'élément correspondant tel qu'il était dans son dernier état dans le DOM - même s'il n'est plus en le DOM. Le javascript met-il en cache le DOM et ne met-il pas à jour les éléments lorsqu'ils sont supprimés du DOM? Que se passe-t-il ici et, plus important encore, comment dois-je y remédier?

Éditer: J'utilise mootools pour faire le retrait et le remplacement des éléments, la documentation pour les fonctions respectives peut être trouvée here et here.

+0

Quel code utilisez-vous pour supprimer l'entrée du DOM? –

+0

l'affichage et l'existence sont différents ... – alex

+0

oui, je clarifiais que ce n'était pas seulement l'affichage, mais il supprime en fait l'élément html. –

Répondre

3

L'évaluation d'un élément par son nom (form.elementName) lorsqu'il est inexistant renvoie undefined. L'évaluation de la valeur de propriété d'un objet ($ ('elementId')) renvoie null. Undefined et null sont traités différemment.

+0

c'est la réponse que je cherchais: P –

+0

c'était la question que je cherchais: P –

1

Eh bien, je peux maintenant répondre à la deuxième partie de ma question: comment y remédier. Si vous utilisez Mootools, puis utilisez la fonction dollar (ou getElementById pourrait fonctionner) au lieu d'utiliser form.selection et form.inputbox:

if ($("inputbox") != null && $("inputbox").value == "") { 
    //don't submit form 
{ 
else if ($("selection") != null && $("selection").value == 0) { 
    //don't submit form 
} 

Il fonctionne, mais je n'ai pas d'expliquer pourquoi l'autre n'a pas.

Questions connexes