Amusons nous avec les sélécteurs

Version imprimable

Bonsoir,
J'ai ce html :

Code:

1
2
3
4
5
6
7
 
<li><label for="sexe">Sexe :</label>
<select name="sexe" id="sexe">
<option value="0">Indifférent</option>
<option value="1">Précision</option>
</select>
</li>

et le jQuery :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
 
$("select[name=sexe]").change(function(){
    if($(this).val() == 1){
        var sexe = [{value: 1, texte: "Homme"},{value: 2, texte: "Femme"}];
	$.each(sexe, function(i, item) { 
            //ce code marche	
            $("select[name=sexe]").after('<input type="radio" name="sexevalue" value="'+item.value+'" /> '+item.texte);
 
            //Pourquoi celui ne marche pas ???
            $("<input/>", {type: "radio", name: "sexevalue", value: item.value}).insertAfter($("select[name=sexe]"));  
						$(":radio[name=sexevalue]").eq(i).after(" "+item.texte);
	});
    }
});

09/09/2011, 20h47
NoSmoking

Bonsoir,
il s'agit d'une mauvaise utilisation du eq(x), le script fait exactement ce que tu lui demandes en indiquant eq(i).
Mais des alertes avant chaque instruction et tu verras l'avancement des insertions en notant bien à quoi correspond eq(i).

Ensuite essaies avec eq(0).

Code:

$(":radio[name=sexevalue]").eq(0).after(" "+item.texte);
09/09/2011, 23h13
danielhagnoul

Bonsoir

En effet, l'élément visé n'est pas le second de la série (eq(1)) mais le premier (eq(0)), car les méthodes obj.after() et insertAfter(obj) ajoute après l'objet et pas en dernière position.

Code:

1
2
3
4
5
6
7
 
        var sexe = $("select[name=sexe]");	       
        var sexetab = [{value: 1, texte: "Homme"},{value: 2, texte: "Femme"}];
        $.each(sexetab, function(i, item) { 
            $("<input/>", {type: "radio", name: "sexevalue", value: item.value}).appendTo(sexe.parent()); 
            $("input[name=sexevalue]").eq(i).after(" "+item.texte);	
        });