Redirection vers une ancre dans listes deroulantes liées

**puceland** · 21/07/2011, 00h54

Bonjour,

Bon voila j'ai un petit soucis étant pas une lumière en programmation je me suis inspiré d'un code déjà crée pour faire le miens

pour faire court il s'agit de deux liste déroulantes liées avec une redirection sur une page html, dès que la sélection du second menu et effectué.

Or pour mes besoins j'aimerais non pas partir sur une autre page mais descendre dans la page ! un peu comme des balise d'ancre ou signet.

j'ai bien trouvé où il faut modifier du moins je pense mais je sais pas par quoi

Code javascript :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
 
    for (i=0;i<txt.length;i++) {
      Item = new Option(txt[i], "4.html", false, false);
      form.lvl.options[i+1]=Item;

Voila le code

En vous remerciant d'avance

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
 
<head>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
<title>sans titre 1</title>
<SCRIPT language="JavaScript">
    <!--
    <!--
    function Choix(form) {
    i = form.metier.selectedIndex;
    form.lvl.options.length=0;
    Item = new Option("Choisissez un lvl", "", false, false);
    form.lvl.options[0]=Item;
    form.lvl.selectedIndex = 0;
    switch (i) {
    case 1 : var txt = new Array ('lvl de 1 à 75 ','lvl de 76 à 150 ','lvl de 151 à 225 ','lvl de 226 à 300 ','lvl de 301 à 375 ','lvl de 376 à 450 ','lvl de 451 à 525'); break;
    case 2 : var txt = new Array ('lvl de 1 à 75 ','lvl de 76 à 150 ','lvl de 151 à 225 ','lvl de 226 à 300 ','lvl de 301 à 375 ','lvl de 376 à 450 ','lvl de 451 à 525'); break;
    case 3 : var txt = new Array ('lvl de 1 à 75 ','lvl de 76 à 150 ','lvl de 151 à 225 ','lvl de 226 à 300 ','lvl de 301 à 375 ','lvl de 376 à 450 ','lvl de 451 à 525'); break;
    case 4 : var txt = new Array ('lvl de 1 à 75 ','lvl de 76 à 150 ','lvl de 151 à 225 ','lvl de 226 à 300 ','lvl de 301 à 375 ','lvl de 376 à 450 ','lvl de 451 à 525'); break;
    case 5 : var txt = new Array ('lvl de 1 à 75 ','lvl de 76 à 150 ','lvl de 151 à 225 ','lvl de 226 à 300 ','lvl de 301 à 375 ','lvl de 376 à 450 ','lvl de 451 à 525'); break;
    case 6 : var txt = new Array ('lvl de 1 à 75 ','lvl de 76 à 150 ','lvl de 151 à 225 ','lvl de 226 à 300 ','lvl de 301 à 375 ','lvl de 376 à 450 ','lvl de 451 à 525'); break;
    case 7 : var txt = new Array ('lvl de 1 à 75 ','lvl de 76 à 150 ','lvl de 151 à 225 ','lvl de 226 à 300 ','lvl de 301 à 375 ','lvl de 376 à 450 ','lvl de 451 à 525'); break;
	case 8 : var txt = new Array ('lvl de 1 à 75 ','lvl de 76 à 150 ','lvl de 151 à 225 ','lvl de 226 à 300 ','lvl de 301 à 375 ','lvl de 376 à 450 ','lvl de 451 à 525'); break;
    case 9 : var txt = new Array ('lvl de 1 à 75 ','lvl de 76 à 150 ','lvl de 151 à 225 ','lvl de 226 à 300 ','lvl de 301 à 375 ','lvl de 376 à 450 ','lvl de 451 à 525'); break;
    case 10 : var txt = new Array ('lvl de 1 à 75 ','lvl de 76 à 150 ','lvl de 151 à 225 ','lvl de 226 à 300 ','lvl de 301 à 375 ','lvl de 376 à 450 ','lvl de 451 à 525'); break;
    case 11 : var txt = new Array ('lvl de 1 à 75 ','lvl de 76 à 150 ','lvl de 151 à 225 ','lvl de 226 à 300 ','lvl de 301 à 375 ','lvl de 376 à 450 ','lvl de 451 à 525'); break;
}
 
    for (i=0;i<txt.length;i++) {
      Item = new Option(txt[i], "4.html", false, false);
      form.lvl.options[i+1]=Item;
      }
    }
    // -->
 
    function MM_jumpMenu(targ,selObj,restore){ //v3.0
      eval(targ+".location='"+selObj.options[selObj.selectedIndex].value+"'");
      if (restore) selObj.selectedIndex=0;
    }
    //-->
    </SCRIPT>
    </head>
    <body>
    <FORM>
       <p>
         <SELECT NAME="metier" onChange='Choix(this.form)'>
                <OPTION>--- Choisissez un Métiers ---</OPTION>
				<OPTION>Calligraphie</OPTION>
				<OPTION>Alchimie</OPTION>
				<OPTION>Couture</OPTION>
				<OPTION>Cuisine</OPTION>
				<OPTION>Enchantement</OPTION>
				<OPTION>Forge</OPTION>
				<OPTION>Ingénierie</OPTION>
				<OPTION>Joaillerie</OPTION>
				<OPTION>Minage</OPTION>
				<OPTION>Secourisme</OPTION>
				<OPTION>Travail du cuir</OPTION>
         </SELECT>
 
       <SELECT NAME="lvl" onChange="MM_jumpMenu('parent',this,0)">
              <OPTION>--- Choisissez un lvl ---</OPTION>
         </SELECT>
      </p>
    </FORM>

**12monkeys** · 21/07/2011, 08h32

Bonjour

Pour les liens d'ancre il faut utiliser la syntaxe suivante : <a href="#nomdelancre">...</a> donc pour être plus précis : #nomdelancre renvoi vers l'ancre appelée nomdelancre.

Plus de renseignements ici : http://j-willette.developpez.com/tut...ge_2#LII-E-2-a

Pour ensuite savoir comment l'intégrer à ton script JavaScript je ne pourrait pas te renseigner...

**puceland** · 21/07/2011, 10h02

Alors vu que j'ai pas réussi à dormir j'ai bossé dessus toute la soirée

et j'ai effectivement trouvé presque la même chose donc je met le code pour les autres personnes qui chercheraient mais par contre je suis tombé sur un autre problème inattendu !

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
}
 
    for (i=0;i<txt.length;i++) {
      Item = new Option(txt[i], "#nomdusignet_1", "#nomdusignet_1", "#nomdusignet_1", "#nomdusignet_1", "#nomdusignet_1", "#nomdusignet_1", "#nomdusignet_1");
      form.lvl.options[i+1]=Item;
      }
    }
    // -->

par contre le problème inattendu on voit dans le code initial que dans mon "switch (i)" il comporte plusieurs "case" 11 pour être plus précis et là le problème se pose c'est que quand je sélectionne le 1er item de ma 1ère liste déroulante je tombe sur le menu 1 qui se trouve dans la "case"1 de mon "switch (i)" et me renvoie donc à mon signet correspondant en fonction de l'item sélectionné dans la liste déroulante du menu 2;

Mais quand je sélectionne le 2eme item de ma 1ère liste déroulante je tombe sur le menu 2 qui se trouve dans la "case"2 de mon "switch (i)"mais celui si me renvoie aussi au même signet !!!!;

enfin je sais pas si c'est très clair si quelqu'un à une solution je suis preneur

En tout cas merci beaucoup pour la réponse

Redirection vers une ancre dans listes deroulantes liées

JavaScript

Vue hybride

Discussions similaires

Partager

Partager