11552 sujets

JavaScript, DOM et API Web HTML5

[Résolu] Problème avec nextSibling

Bonjour,

voici mon code : 
<html>
	<head>
		<title>titre</title>
		<script language="JavaScript" type="text/javascript">
		function addOption(id,value,pays){
				var select ='';
			// Booléen reconnaissant le navigateur
			  var isIE = (document.all);
			  var isNN6 = (!isIE) && (document.getElementById);
			
			  // Compatibilité : l'objet menu est détecté selon le navigateur
			  if (isIE) select = document.all[id];
			  if (isNN6) select = document.getElementById(id);
			  
			  var newoption = document.createElement("option");
			  newoption.value=value;
			  newoption.selected='selected';
			  var newoptiontext = document.createTextNode(pays);
			  newoption.appendChild(newoptiontext);
			  select.appendChild(newoption);
			  var frere = select.nextSibling;
			  frere.style.display='none';
		}
		</script>
	</head>
	<body>
		<form name="form1">
			<p>
				<select name="formselect1" size="1" id="idSelectPays">
				    <option value="1">France</option>
				    <option value="2">Allemagne</option>
				</select> 
				<a href="javascript:addOption('idSelectPays','3','Espagne');" title="ajout">add</a>  
			</p>
		</form>
	</body>
</html>


Je souhaite faire une fonction javascript qui ajoute une option à un select et qui cache le noeud qui suit le select (ici le lien <a>).
J'utilise pour cela nextSibling pour recupérer le noeud suivant mais ça ne marche pas.
a écrit :
Erreur : frere.style has no properties



nextSibling renvoit-il bien le noeud suivant ??

Quelqu'un saurait m'aider ??

merci

Poich




PS : pour pleins de raisons je souhaite cacher le noeud suivant le <select>. Je ne peux donc pas me résoudre à utiliser un id pour le lien ou un this ou quoi que se soit d'autres.
Modifié par Poich (29 Jul 2005 - 10:01)
Poich a écrit :

Je souhaite faire une fonction javascript qui ajoute une option à un select et qui cache le noeud qui suit le select (ici le lien <a>).
J'utilise pour cela nextSibling pour recupérer le noeud suivant mais ça ne marche pas.
Erreur : frere.style has no properties



nextSibling renvoit-il bien le noeud suivant ??


Oui. Et le nœud suivant ton SELECT n'est pas le A mais un nœud texte contenant un espace et un saut de ligne. Les éventuels caractères blancs entre des balises comptent comme des nœuds texte.

On en parle dans un sujet récent:
http://forum.alsacreations.com/topic.php?fid=5&tid=5628
Bonjour,
On peut sauter le noeud #text avec un test sur tagName :
var frere = select.nextSibling;
if(frere.tagName!="A")frere=frere.nextSibling 
frere.style.display='none';


J'en ai profité pour supprimé le code inutile de ta fonction:

function addOption(id,value,pays){
select = document.getElementById(id);
var newoption = document.createElement("option");
newoption.value=value;
newoption.selected='selected';
var newoptiontext = document.createTextNode(pays);
newoption.appendChild(newoptiontext);
select.appendChild(newoption);
var frere = select.nextSibling;
if(frere.tagName!="A")frere=frere.nextSibling 
frere.style.display='none';
}
chmel a écrit :
On peut sauter le noeud #text avec un test sur tagName :
var frere = select.nextSibling;
if(frere.tagName!="A")frere=frere.nextSibling 
frere.style.display='none';


Les nœuds texte n’ont pas d’attribut tagName. Utilise plutôt l’attribut nodeType qui est justement là pour ce genre de cas:

var frere = select.nextSibling;
while( (frere = frere.nextSibling) && frere.nodeType != 1 ); // 1 == Node.ELEMENT_NODE
frere.style.display='none';
Bonjour,

A priori le nextSibling est plus approprié aux <ul><li>
Et là on est au select, alors on peut utiliser les propriétes du select.
<form name="form0"....>
<select name="formselect1" size="1" id="idSelectPays">
<option value="1">France</option>
<option value="2">Allemagne</option>
</select>
...
var frere = 
document.form0.formselect1[document.form0.formselect1.selectedIndex+1].value;

Modifié par Deny (28 Jul 2005 - 14:58)
Bobe a écrit :


Les nœuds texte n’ont pas d’attribut tagName. Utilise plutôt l’attribut nodeType qui est justement là pour ce genre de cas:

var frere = select.nextSibling;
while( (frere = frere.nextSibling) && frere.nodeType != 1 ); // 1 == Node.ELEMENT_NODE
frere.style.display='none';

mouais, il cherchait à atteindre un lien Smiley cligne
OK pour nodeType , mais while sans garde-fou Smiley ohwell
je pense qu'il veut dire que s'il ne rencontre que des éléments Node il pourrait y avoir une boucle infinie.

En ce qui me concerne vous m'avez parfaitement bien aidé et tout marche nikel Smiley smile

Il y a tellement de solutions proposées que je ne sais même plus laquelle choisir ! Smiley lol


merci à vous et longue vie au forum !

Poich
Poich a écrit :
je pense qu'il veut dire que s'il ne rencontre que des éléments Node il pourrait y avoir une boucle infinie.


Non, non, un nœud ne peut pas avoir une infinité d'enfants.
Bobe a écrit :


Peux-tu détailler ?

Avec la méthode while, j'ajoute toujours une condition avec un compteur limité pour justement éviter la boucle infini sur un navigateur qui n'aurai compris la 1ère condition.
Mais la c'était un éxemple alors j'ai écris une connerie Smiley confus
Sujet clos
Aller à