[Js] Appel div avec nom variable concaténé?
Résolu
lomic2
Messages postés
14
Statut
Membre
-
Alain_42 Messages postés 5413 Statut Membre -
Alain_42 Messages postés 5413 Statut Membre -
Bonjour,
Un petit souci, je bute dessus sans trouver, peut-être des yeux extérieurs y verront plus clair...
Je vous expose le problème:
Une carte, des points sur cette carte, au survol des points, un div contenant des informations pop en haut de page, jusque là rien d'extraordinaire.
Là où ça se complique c'est lorsque je veux afficher des infos distinctes sur chaque point, ma méthode:
Côté serveur, je créé en PHP
- Tous les points, chacun dispose d'une fonction "onMouseOver" qui lance ma fonction javascript "pop_div" en lui passant en argument le numéro du point, "no"
- Tous les divs "infos_no" (autant qu'il existe de points sur la carte) contenant les infos qui doivent s'afficher au survol du point associé.
Résultat sur la page générée en prenant par exemple le point 3:
côté js:
cependant ça ne fonctionne pas... et je cherche sans trouver pourquoi...
voilà si quelqu'un peut me mettre le nez sur ce qui coince, ça serait très sympa :)
Un petit souci, je bute dessus sans trouver, peut-être des yeux extérieurs y verront plus clair...
Je vous expose le problème:
Une carte, des points sur cette carte, au survol des points, un div contenant des informations pop en haut de page, jusque là rien d'extraordinaire.
Là où ça se complique c'est lorsque je veux afficher des infos distinctes sur chaque point, ma méthode:
Côté serveur, je créé en PHP
- Tous les points, chacun dispose d'une fonction "onMouseOver" qui lance ma fonction javascript "pop_div" en lui passant en argument le numéro du point, "no"
- Tous les divs "infos_no" (autant qu'il existe de points sur la carte) contenant les infos qui doivent s'afficher au survol du point associé.
Résultat sur la page générée en prenant par exemple le point 3:
côté js:
<script type="text/javascript"> function pop_div(no){ var element = document.getElementById.eval("infos_"+no); element.style.visibility = "visible"; } function close_div(no){ var element = document.getElementById.eval("infos_"+no); element.style.visibility = "hidden"; } </script>le spot "3":
<div id="mon_point_3" style="position:relative;top:256px;left:482px;z-index:2"> <img src="images/spot.png" border="0" alt="mon_point_3" onMouseOver="pop_div(3);"> </div>le div "3" à faire poper
<div id="infos_3" style="position:absolute;top:10px;left:10px;visibility:hidden;z-index:6">{contenu html}</div>dans mes fonctions js, eval("infos"+no) est censé pour moi valoir "infos_3" si je survole le point 3, et donc s'appliquer au div qui porte le nom "infos_3" et dans la fonction "pop_div" le rendre "visible", dans la fonction close_div, le rendre "hidden"
cependant ça ne fonctionne pas... et je cherche sans trouver pourquoi...
voilà si quelqu'un peut me mettre le nez sur ce qui coince, ça serait très sympa :)
A voir également:
- [Js] Appel div avec nom variable concaténé?
- Nommez une application d'appel vidéo ou de visioconférence - Guide
- Appel privé - Guide
- Nom de l'adresse - Forum Réseaux sociaux
- Prix d'un appel local - Forum Vos droits sur internet
- Trouver un nom avec une adresse ✓ - Forum Réseaux sociaux
4 réponses
Bonsoir,
var element = document.getElementById.eval("infos_"+no);
habituellement c'est de la forme:
donc dans ton cas:
ou essayes même:
var element = document.getElementById.eval("infos_"+no);
habituellement c'est de la forme:
var element = document.getElementById('id');
donc dans ton cas:
var element = document.getElementById(eval("infos_"+no));
ou essayes même:
var element = document.getElementById.l("infos_"+no);
Petit progrès...
J'ai changé mon "onMouseOver" en "onClick" pour déclencher plus sûrement l'affichage du div et là j'ai une erreur javascript qui me parait intéressante:
"infos_1 is not defined"
côté div il y en a bien un qui s'appelle "infos_1" par contre c'est peut-être au niveau de ma fonction "pop_div" avec le document.getElementById qui ne trouverait pas l'élément qui s'appelle "infos_1" ?
Je creuse je creuse, je sens que c'est pas loin :D
Je retente les variantes de syntaxe de cette partie avec "eval" ou "l"
J'ai changé mon "onMouseOver" en "onClick" pour déclencher plus sûrement l'affichage du div et là j'ai une erreur javascript qui me parait intéressante:
"infos_1 is not defined"
côté div il y en a bien un qui s'appelle "infos_1" par contre c'est peut-être au niveau de ma fonction "pop_div" avec le document.getElementById qui ne trouverait pas l'élément qui s'appelle "infos_1" ?
Je creuse je creuse, je sens que c'est pas loin :D
Je retente les variantes de syntaxe de cette partie avec "eval" ou "l"
j'avance... j'avance ;)
à coup de boite d'alerte, je constate que l'appel à la fonction est ok, quel le paramètre est bien passé, j'ai un peu modifié:
et je vois apparaitre furtivement mon div, reste à voir pourquoi il disparait, comme si le passage à "visible" ne tenait pas...
ça avance!
à coup de boite d'alerte, je constate que l'appel à la fonction est ok, quel le paramètre est bien passé, j'ai un peu modifié:
var div_number = "infos_" + numero; alert('div number: ' + div_number); var element = document.getElementById(div_number); element.style.visibility = "visible";là j'ai bien une alerte qui me dit "div_number: infos_1", impeccable
et je vois apparaitre furtivement mon div, reste à voir pourquoi il disparait, comme si le passage à "visible" ne tenait pas...
ça avance!
Bon ben ça fonctionne, code final:
pour les appels aux fonctions:
merci Alain tu m'as permis d'y voir plus clair!
<script type="text/javascript"> function popup_div(numero){ var div_number = "infos_" + numero; var element = document.getElementById(div_number); element.style.visibility = "visible"; } function close_div(numero){ var div_number = "infos_" + numero; var element = document.getElementById(div_number); element.style.visibility = "hidden"; } </script>
pour les appels aux fonctions:
<img src="images/spot.png" border="0" alt="mon_point_3" onMouseOver="popup_div('3');"> <img src="images/close.png" onclick="close_div('3')"
merci Alain tu m'as permis d'y voir plus clair!
Cependant, comme j'ai le sentiment d'être proche de la solution et qu'en prime ta réponse m'incite à penser que je ne fais pas complètement n'importe quoi, j'élargis ma recherche...
Hypothèse 1: ça fonctionne mais je ne vois pas le div car il pope hors de ma vue
=> je pense pas car j'ai retiré toutes les contraintes de dimensions sur le div qui contient tout ce petit monde
Hypothèse 2: c'est l'appel à la fonction qui coince, j'ai positionné un à l'intérieur pour avoir une boite d'alerte lors de l'appel à la fonction...
=> la boite n'apparait pas :-?, la fonction est bien déclarée avant son appel, et lorsque j'appelais la version précédente de la fonction (qui ne prenait pas de paramètre), ça fonctionnait bien...
Je creuse toujours...
Elle te sort les erreurs Javascript
function pop_div(no)
change le nom de l'argument " no" est peut être un nom réservé ??
ensuite dans l'appel de la fonction:
onMouseOver="pop_div(3)
il faut passer une valeur:
3 est considéré comme une variable si elle n'est pas entre '
Pour les quotes j'y ai pensé après et j'en ai ajouté, cependant ça ne change pas :)
Merci encore pour ton aide ;)