Forum |  HardWare.fr | News | Articles | PC | S'identifier | S'inscrire | Shop Recherche
2861 connectés 

  FORUM HardWare.fr
  Programmation
  HTML/CSS

  recuperer valeur html -> javascript

 


 Mot :   Pseudo :  
 
Bas de page
Auteur Sujet :

recuperer valeur html -> javascript

n°1352844
bnas
Posté le 24-04-2006 à 16:29:08  profilanswer
 

Bonjour tout le monde!
 
Voila ca fait un moment que je m'acharne sur un menu dynamique extensible.
 
Je veux dans le code html suivant:
 

Citation :

<ul id="menu">
  <li>Menu :</li>
 
   <li id='statique.htm'>Pesage statique
      <ul>
    <li onMouseDown="javascript:lien_a_recup='melange.htm'">Composition de melanges
            <ul>
      <li><a href="javascript:charger('#','essai.htm')">essai</a></li>
   </ul>
  </li>
   </ul>
   </li>


 
récupérer la valeur du lien correspondant à chaque partie. Ici pour essai pas de prob on appelle directement la fonction charger mais pour les parties qui ouvrent un lien mais qui doivent aussi ouvrir les sous menus correspondant je fais appel a des autres fonctions (dans menu.js). J'aimerai donc avoir la valeur du lien à pointer dans une variable pour l'utiliser.  
 
Je ne sais pas si j'ai été assez clair.. :pt1cable:  
 
J'ai essayé de mettre un ID au tag <li> mais je ne sais pas comment le récuperer. (machin.firstChild.id ca marche pas apparemment.  
J'ai aussi essayé avec onMouseOver je stocke le lien dans une variable mais dans mes autres fonctions après j'ai aussi un OnMouseDown donc il y a conflit des fois il trouve pas la valeur de lien_a_recup.
 
Merci si vous avez compris   :jap:
 
Pour préciser, bout de code javascript:

Code :
  1. if(L.getElementsByTagName('ul')[0]){ // sous-menu éxistant
  2.     titre=L.firstChild.data;
  3. L.removeChild(L.firstChild);
  4.     L.innerHTML='<a href="#" title="développer" onkeydown="af(this,page2)"
  5. onmousedown="af(this,page2);return false">'+titre+'<\/a>'+L.innerHTML;
  6. ef(L.firstChild); // réduit les sous_menus
  7.   }


Code :
  1. function af(el,pagedeux) { // développe un sous-menu .
  2. L.firstChild.href=charger('#',pagedeux);

Message cité 1 fois
Message édité par bnas le 24-04-2006 à 17:02:06
mood
Publicité
Posté le 24-04-2006 à 16:29:08  profilanswer
 

n°1352858
anapajari
s/travail/glanding on hfr/gs;
Posté le 24-04-2006 à 16:42:57  profilanswer
 

bnas a écrit :

Ici pour essai pas de prob on appelle directement la fonction charger mais pour les parties qui ouvrent un lien mais qui doivent aussi ouvrir les sous menus correspondant je fais appel a des autres fonctions (dans menu.js).


Tu voudrais des item qui "déployent" les sous-menus associés et en même temps ouvrent un lien ( dans une autre frame ou un popup j'imagine), c'est bien ça?

n°1352874
bnas
Posté le 24-04-2006 à 17:00:19  profilanswer
 

tout a fait.  
 
voici index.htm:
 

Citation :


<FRAMESET COLS="230,*">
 <FRAME NAME="left" SRC="menu.htm">
 <FRAME NAME="right" SRC="">
</FRAMESET>


 
 
Le problème est que je ne peux pas utiliser la balise <a></a> comme pour la partie essai car lorsqu'il s'agit d'un menu ouvrant un sous menu je fais déjà un L.innerHTML='<a href.....


Message édité par bnas le 24-04-2006 à 17:08:13
n°1352884
anapajari
s/travail/glanding on hfr/gs;
Posté le 24-04-2006 à 17:09:38  profilanswer
 

bon j'avais fait un arbre y'a pas longtemps dans le même genre ( http://forum.hardware.fr/forum2.ph [...] w=0&nojs=0 )
En le modifiant a peine ça doit faire ce que tu veux:

Code :
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
  2.   "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
  3. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" >
  4. <head>
  5.   <meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
  6.   <title>Test</title>
  7.   <script type="text/javascript">
  8.   /*** param is a node which has been clicked ***/
  9.   function show(lnkNode){
  10.     var sonsNode = lnkNode.parentNode.getElementsByTagName('*');
  11.     if ( sonsNode.length >= 1 && sonsNode[1].tagName == 'UL' && sonsNode[1].className == "disp" ){
  12.       sonsNode[1].className = "";
  13.       lnkNode.parentNode.className = "";
  14.     } else {
  15.       sonsNode[1].className = "disp";
  16.       lnkNode.parentNode.className = "disp";
  17.     }
  18.     return true;
  19.   }
  20.   </script>
  21.   <style type="text/css">
  22.   ul{
  23.     display: none;
  24.   }
  25.   ul.disp{
  26.     display: block;
  27.   }
  28.   li{
  29.     display : list-item;
  30.     list-style-image : url(plus.png);
  31.     list-style-position: outside;
  32.   }
  33.   li.disp{
  34.     list-style-image : url(minus.png);
  35.   }
  36.   </style>
  37. </head>
  38. <body >
  39.    <ul class="disp">
  40.      <li>
  41.        <a href="truc.html" target="right" onclick="return show(this)">Truc 1:</a>
  42.        <ul>
  43.          <li>Truc 1_1</li>
  44.          <li>Truc 1_2</li>
  45.          <li>
  46.    <a href="truc.html" target="right" onclick="return show(this)">Truc 1_3:</a>
  47.    <ul>
  48.              <li>Truc 1_3_1</li>
  49.              <li>Truc 1_3_2</li>
  50.              <li>Truc 1_3_3</li>
  51.              <li>Truc 1_3_4</li>
  52.      <li>
  53.                <a href="truc.html" target="right" onclick="return show(this)">Truc 1_3_5:</a>
  54.        <ul>
  55.                  <li>Truc 1_3_5_1</li>
  56.                  <li>Truc 1_3_5_2</li>
  57.                  <li>Truc 1_3_5_3</li>
  58.                  <li>Truc 1_3_5_4</li>
  59.        </ul>
  60.      </li>
  61.    </ul>
  62.  </li>
  63.        </ul>
  64.      </li>
  65.      <li>
  66.        <a href="truc.html" target="right" onclick="return show(this)">Truc 2:</a>
  67.        <ul>
  68.          <li>Truc 2_1</li>
  69.          <li>Truc 2_2</li>
  70.          <li>
  71.    <a href="truc.html" target="right" onclick="return show(this)">Truc 2_2_3</a>
  72.    <ul>
  73.              <li>Truc 2_2_3_1</li>
  74.              <li>Truc 2_2_3_2</li>
  75.              <li>Truc 2_2_3_3</li>
  76.    </ul>
  77.  </li>
  78.        </ul>
  79.      </li>
  80.    </ul>
  81. </body>
  82. </html>


et si ça te va pas, détailles un peu plus le fonctionnement de ton menu :)

n°1352897
bnas
Posté le 24-04-2006 à 17:17:55  profilanswer
 

merci je vais voir ce que je peux faire

n°1353276
bnas
Posté le 25-04-2006 à 08:48:30  profilanswer
 

Est-ce qu'il n'y aurait pas un moyen de récupérer dans la balise <li> une variable qui contiendrait l'adresse du lien vers lequel elle pointe pour l'utiliser dans le code javascript?
 
par exemple:

Code :
  1. <li>< PAGE2= 'statique.htm'> Pesage statique
  2. <ul>...
  3.    </ul>
  4.   </li>


Code :
  1. ...     
  2. if(L.getElementsByTagName('ul')[0]){ // sous-menu éxistant
  3.          titre=L.firstChild.data;
  4.           L.removeChild(L.firstChild);
  5.          L.innerHTML='<a href="#" title="développer" onkeydown="af(this,PAGE2)"
  6.       onmousedown="af(this,PAGE2);return false">'+titre+'<\/a>'+L.innerHTML;
  7.           ef(L.firstChild); // réduit les sous_menus
  8.        }


 
mais pour chaque lien la variable PAGE2 va changer. JE sais plus comment faire la. Anajpari ton menu est bien mais celui que j'ai la permet d'avoir un lien ouvert par défaut ou encore de n'avoir qu'un seul sous menu ouvert par niveau.
 
Peut être avez vous une solution (meme en PHP..)


Message édité par bnas le 25-04-2006 à 09:09:06
n°1353398
bnas
Posté le 25-04-2006 à 11:23:57  profilanswer
 

youhou j'ai trouvé comment faire! c'est pas terrible au niveau du code mais c'est le seul moyen que j'ai trouvé
 
j'ai remplacé ceci:

Code :
  1. //ajoute un titre cliquable
  2.    if(L.getElementsByTagName('ul')[0]){ // sous-menu éxistant
  3.    titre=L.firstChild.data;
  4.    L.removeChild(L.firstChild);
  5.    L.innerHTML='<a href="#" title="développer" onmousedown="af(this,page2,1);return false">'+titre+'<\/a>'+L.innerHTML;
  6.    ef(L.firstChild); // réduit les sous_menus
  7.    }


par:

Code :
  1. //ajoute un titre cliquable
  2.    if(L.getElementsByTagName('ul')[0]){ // sous-menu éxistant
  3.    titre=L.firstChild.data;
  4.    L.removeChild(L.firstChild);
  5.    lier(L);
  6.    ef(L.firstChild); // réduit les sous_menus
Code :
  1. function lier(el){
  2.  switch (el.id) {
  3.          case "statique" : el.innerHTML='<a href="#" title="développer"
  4. onmousedown="af(this,\'statique.htm\',1);return false">'+titre+'<\/a>'+el.innerHTML;break;
  5.          case "melange"  : el.innerHTML='<a href="#" title="développer"
  6. onmousedown="af(this,\'melange.htm\',1);return false">'+titre+'<\/a>'+el.innerHTML;break;
  7.          case "dynamique": el.innerHTML='<a href="#" title="développer"
  8. onmousedown="af(this,\'dynamique.htm\',1);return false">'+titre+'<\/a>'+el.innerHTML;break;
  9. ...
  10. }}


tout simplement!!
en rajoutant un ID à chaque tag <li> suivi d'un <ul> (càd suivi de sous menu)


Message édité par bnas le 25-04-2006 à 11:26:29

Aller à :
Ajouter une réponse
  FORUM HardWare.fr
  Programmation
  HTML/CSS

  recuperer valeur html -> javascript

 

Sujets relatifs
Select et javascriptproblème page html avecMyeclipse
Incrementer la valeur d'une cellule.problème de diaporama creé en javascript
javascript et fichier texte en localVariables HTML avec applet JAVA
Récuperer le nom d'un bouton d'une applicationRécupérer le code html d'une page web
recuperer une chaine dans une page 
Plus de sujets relatifs à : recuperer valeur html -> javascript


Copyright © 1997-2022 Hardware.fr SARL (Signaler un contenu illicite / Données personnelles) / Groupe LDLC / Shop HFR