Probléme lié a systeme de drag & drop avec un ul/li

[Résolu]
Signaler
Messages postés
249
Date d'inscription
jeudi 17 février 2005
Statut
Membre
Dernière intervention
29 août 2011
-
Messages postés
249
Date d'inscription
jeudi 17 février 2005
Statut
Membre
Dernière intervention
29 août 2011
-
bonjour,

tout d'abort, la liste :
 
<ul class= "capsulMenuAdminOrder" id="ulAdminOrder">
    <li id="liAdminOrder1" class="capsulMenuAdminOrder">Accueil</li>
    <li id="liAdminOrder2" class="capsulMenuAdminOrder">Actualités</li>
    <li id="liAdminOrder3" class="capsulMenuAdminOrder">Présentation</li>
    <li id="liAdminOrder4" class="capsulMenuAdminOrder">Réglements</li>
    <li id="liAdminOrder7" class="capsulMenuAdminOrder">Administration</li>
    <li id="liAdminOrder11" class="capsulMenuAdminOrder">Pilotes</li>
    <li id="liAdminOrder12" class="capsulMenuAdminOrder">Equipes</li>
</ul>

Avec une function javascript, je connais l'élément en cours de drag, son parent ('ul'). Maintenant, j'aimerai connaitre les elements (LI) qui le suive et precede.

J'ai trouvé les functions suivantes nextSibling et previousSibling qui me sorte un [OBJECT TEXT] (ex : document.getElementById('liAdminOrder7').nextSibling). Cependant, je n'arrive à rien faire avec cette objet comme trouvé son id ([OBJECT TEXT].id = undefined) !

Si quelqu'un peut m'aigullier comment fonction ces methodes ! Merci d'avance

Mon book : D2SKILLhttp://race24h.org/
http://www.exile.fr

5 réponses

Messages postés
3426
Date d'inscription
lundi 26 décembre 2005
Statut
Membre
Dernière intervention
14 janvier 2011
18
Bonjour,
Pas sûr qu'il existe un TUTO la dessus de
la doc oui.
Un petit exemple pour t'aider à appréhender le sujet
<html>
<head>

<style type= "text/css">
body {
  font-family : Verdana;

  font-size : 13px;
}
i {
  color : #0000ff;
}
.li_200 {

  width : 200px;
  border : 1px dashed blue;
}
</style>

<script type="text/javascript">
//-----------------
function Test( id_){

  var O_Src = document.getElementById( id_);
  var O_Parent =
O_Src.parentNode;
  var szResult = '' +O_Parent.id
+'<\/b><\/br>';

  //-- Parcours des
childNodes
  for( var i =0; i < O_Parent.childNodes.length;
i++){
    var O_Child = O_Parent.childNodes[i];
    szResult += '-
' +O_Child.nodeName +'<\/b>';

     //-- ne traite que si type ELEMENT
    if(
O_Child.nodeType == 1){
      //-- quelques
caracteristiques au hasard
      szResult += ' id
<\/i>= "' +O_Child.id +'"';
      szResult += ', innerHTML
<\/i>= ' +O_Child.innerHTML;
      szResult += ',
firstChild.nodeValue <\/i>= ' +O_Child.firstChild.nodeValue;

      szResult += ', offsetTop <\/i>= ' +O_Child.offsetTop;

      szResult += ', offsetLeft <\/i>= ' +O_Child.offsetLeft;

      szResult += ', offsetWidth <\/i>= '
+O_Child.offsetWidth;
    }
    szResult += '
';
  }

  document.getElementById( 'D_RESULT').innerHTML = szResult;
}

</script>
</head>


  <li id="li_1"
>Accueil</li>
  <li id="li_2" >Actualités</li>

  <li id="li_3" class="li_200">Présentation</li>
  <li
id="li_4" >Réglements</li>
  <li id="li_5"
>Administration</li>
  <li id="li_6">Pilotes</li>

  <li id="li_7">Equipes</li>

[javascript:Test('li_2'); Test]



</html>
Voila bon jeu...
;O)
Messages postés
3426
Date d'inscription
lundi 26 décembre 2005
Statut
Membre
Dernière intervention
14 janvier 2011
18
Bonjour,
pourquoi ne pas récupérer le parentNode et ensuite parcourir les childNodes
;O)
Messages postés
249
Date d'inscription
jeudi 17 février 2005
Statut
Membre
Dernière intervention
29 août 2011

Heu ouai, j'avais déjà testé mais je n'ai que trés peu de connaisance en Node, tu n'aurai pas un tuto explicite sur le foncitonnement des "noeud".

Bye, mercihttp://race24h.org/
http://www.exile.fr
Messages postés
1788
Date d'inscription
vendredi 9 mai 2008
Statut
Modérateur
Dernière intervention
24 juillet 2021
132
bonjour
une voila adresse asser generaliste au sujet du dom

ici
Messages postés
249
Date d'inscription
jeudi 17 février 2005
Statut
Membre
Dernière intervention
29 août 2011

Merci beaucoup,

Ca m'aide pas mal effectivement ;)http://race24h.org/
http://www.exile.fr