Lien URL avec JavaScript et guillemets

**yanchasp** · 15/09/2008, 19h32

Salut,
voila je suis sur de faire une erreur dans mes guillemets, mais impossible de trouver

Code :

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

1
2
$bulle = 'onMouseOver="afficheDescURL(\''.$row2[formule].'\')" onMouseOut="afficheDescURL(base)"';
	$KeywordGras[]= "<a href=\"#\" class=\"LienKeyword\" ".$bulle." >".$row2['nom']."</a>";

Ca déconne au niveau de "OnMouseOver" le reste est bon.

merci d'avance.

**anaranjado** · 15/09/2008, 19h36

Huh ... je ne vois pas d'erreur dans votre script.

Quel est le message d'erreur retourné par Firebug?

**yanchasp** · 15/09/2008, 19h52

il n'y en a pas.
par contre sur ma page il m'ecrit un bout de code dans mon texte

**anaranjado** · 15/09/2008, 19h57

Essayez à faire :

Code :

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

1
2
 
echo $row2[formule];

Vérifiez la valeur de cette variable...

**yanchasp** · 15/09/2008, 20h05

la variable est ok.

par contre je viens de voir un truc bizarre

Code :

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

$bulle = 'onMouseOver="afficheDescURL(\'tes\')" onMouseOut="afficheDescURL(base)"';

cette ligne fonctionne.
Mais si je mets "test" à la place de "tes" ...... j'ai des erreurs.

C'est quand meme bizarre

**Kerod** · 15/09/2008, 20h10

Ca donne quoi avec ceci :

Code :

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

1
2
    $bulle = 'onmouseover="afficheDescURL(\'' . $row2['formule'] . '\')" onmouseout="afficheDescURL(\'base\')"';
    $KeywordGras[] = '<a href="#" class="LienKeyword" ' . $bulle . '>' . $row2['nom'] . '</a>';

**yanchasp** · 15/09/2008, 20h23

Envoyé par Kerod

Ca donne quoi avec ceci :

Code :

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

1
2
    $bulle = 'onmouseover="afficheDescURL(\'' . $row2['formule'] . '\')" onmouseout="afficheDescURL(\'base\')"';
    $KeywordGras[] = '<a href="#" class="LienKeyword" ' . $bulle . '>' . $row2['nom'] . '</a>';

ca ne marches pas non plus.

Je vous donnes un peu de complement pour aider

J'ai une base de donne avec des mots clés et leurs définitions, puis un texte.
Lors de l'affichage du texte je fais apparaitre les mots clés en gras, avec un lien info bulle pour la définition.
voici le JS, c'est pour ouvrir une sorte d'info bulle.
Le code est ok

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
<script type="text/javascript"><!--
function afficheDescURL(toThis)
  {
  if (document.getElementById)
    {
    document.getElementById("textDiv").innerHTML = toThis;
    }
  else if (document.all)
    {
    document.all["textDiv"].innerHTML = toThis;
    }
  }
 
base = "<i>passez sur la souris pour lire un mot cle</i>";
afficheDescURL(base);
//--></script>

Ensuite je me connecte à ma base et vais cherche tous mes mots cles.
Puis je cherche dans le texte les mots correspondant, pour les mettre en gras et la definition dans la bulle.

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
$query2 = 'SELECT nom,formule FROM keyword';
$result2 = mysql_query($query2);
$row2 = mysql_fetch_assoc($result2); 
while ($row2 = mysql_fetch_assoc($result2)){
	//$KeywordGras[]= '<b><i>'.$row2['nom'].'</i></b>';
	//$KeywordGras[]= '<a href=\'#\' class=\'LienKeyword\' >'.$row2['nom'].'</a>';   onMouseOver="afficheDescURL(\'test\')" onMouseOut="afficheDescURL(base)' .$row2['formule'].
	//$bulle = 'onMouseOver="afficheDescURL(\''.$row2[formule].'\')" onMouseOut="afficheDescURL(base)"';
	$bulle = 'onMouseOver="afficheDescURL(\'tes\')" onMouseOut="afficheDescURL(base)"'; 
	$KeywordGras[]= "<a href=\"#\" class=\"LienKeyword\" ".$bulle." >".$row2['nom']."</a>";
	$Keyword[]=$row2['nom'];
}
 
$LaDefinition = str_ireplace($Keyword, $KeywordGras, $row['texte']);

puis j'affiche $LaDefinition

Voila j'espere que ca vous aidera a m'aider car la je comprends plus.

PS: "base" pour le onmouseover, c'est un id pas un texte.

**Kerod** · 15/09/2008, 20h27

Elle est en ligne la page ??
Possible d'avoir le code HTML généré pour voir si c'est pas juste un soucis de génération ? C'est-à-dire le code affiché par le navigateur.

**yanchasp** · 15/09/2008, 20h40

Non elle est pas en ligne.

Voici code html, avec 'tes'

Code html :

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
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
<div align="center">
bienvenue sur la maquette <br />
 
<a href='index.php?page=definition'>definition</a> <a href='index.php?page=add.keywords'>keywords</a> 
 
</div><br />
 
<div align="center">
Veuillez selectionner un mot cles, puis cliquez sur la fleche.<br />
Recommencez autant de fois que necessaire, puis enregistrez.<br />
 
<style type="text/css"> 
a.LienKeyword   {     
color:blue;    
text-decoration:none;
border-bottom-width: 2px;
border-bottom-style: dotted;
border-bottom-color: #blue;   }  
    
a.LienKeyword:hover   {     
/*font-style:italic;*/
}   
 
</style> 
 
<!-- script pour les bulles infos des mots cles -->
<script type="text/javascript"><!--
function afficheDescURL(toThis)
  {
  if (document.getElementById)
    {
    document.getElementById("textDiv").innerHTML = toThis;
    }
  else if (document.all)
    {
    document.all["textDiv"].innerHTML = toThis;
    }
  }
 
base = "<i>passez sur la souris pour lire un mot cle</i>";
afficheDescURL(base);
//--></script>
<!-- fin du script de l'info bulle -->
 
 
ID=9
</div>
 
 <html>
 <head>
 <title>Les Mots cles</title>
 
<!-- fonction pour envoyer la liste selectionne par defaut grace a JS -->
 <script language="javascript">
     function formsubmit () {
        var l = document.getElementById('Liste');
        for (var i=0; i < l.options.length; i++) l.options[ i ].selected = true;
        }
 </script>
<!-- fin script -->
 
 <script type="text/javascript">
 function getSelectedText(){
 if (window.getSelection){
 var str = window.getSelection();
 }else if (document.getSelection){
 var str = document.getSelection();
 }else {
 var str = document.selection.createRange().text;
 }
 return str;
 }
 function affichage(){
      var sel = getSelectedText();
     if (sel!=''){
        //ecriture dans champ 
        var liste = document.getElementById('Liste');
        liste.options[liste.options.length] = new Option(sel);
     }
     else{
        alert("Aucun mot cle selectionne !");
        return(false); 
     }
 }
 
 function Destroy(){
    if (document.getElementById("Liste").options.selectedIndex >= 0) {
    /* boucle tant qu'il reste des Ã©lÃ©ments sÃ©lectionnÃ©s */
        while (document.getElementById("Liste").options.selectedIndex >= 0) { 
            /* index de l'Ã©lÃ©ment sÃ©lectionnÃ© */
            index = document.getElementById("Liste").options.selectedIndex;
            /* suppression de l'Ã©lÃ©ment sÃ©lectionnÃ© dans la liste d'origine */
            document.getElementById("Liste").options[index] = null; 
            alert('le mot cle a ete supprime');
        }
    }
    else
        alert("Aucun mot cle selectionne !");
        return(false); 
 }
 </script>
 
 </head>
 <body>
 
 <!-- on fait une requete pour trouver lmes mots cles prÃ©sent dans le texte et pour les mettre en gras -->
 <!-- fin de requete mot cles -->
 
 <form name="form1" method="POST" action="index.php?page=add.keywords&action=saisie" class="#" onSubmit="return formsubmit();">
   <table border="1" align="center">
     <tr>
         <td id="selection" align="center" bgcolor="#CCCCCC" width="400">Definition</td>
        <td align="center" bgcolor="#CCCCCC">Action</td>
        <td align="center" bgcolor="#CCCCCC">Mots cles</td>
     </tr>
 
    <tr>
        <td><b>Titre: </b>Cinéma</td>
        <td rowspan="2" align="center"><input type="button" onClick="affichage()" value="Ajouter" /><br><input type="button" onClick="Destroy()" value="Supprimer" /></td>
      <td rowspan="2">  
        <select name="Liste[]" id="Liste" style="width:130" multiple="multiple"></select></td> 
    </tr>
 
 
</td>
    </tr>
 
    <tr>
        <!-- appel d'une fonction php qui corrige dans le texte les Maj/Min -->
        <td name="liste1">[abréviation de cinématographe] <a href="#" class="LienKeyword" onMouseOver="afficheDescURL('tes')" onMouseOut="afficheDescURL(base)" >procédé</a> qui perm<a href="#" class="LienKeyword" onMouseOver="afficheDescURL('tes')" onMouseOut="afficheDescURL(base)" >et</a> d'enregistrer <a href="#" class="LienKeyword" onMouseOver="afficheDescURL('tes')" onMouseOut="afficheDescURL(base)" >et</a> de proj<a href="#" class="LienKeyword" onMouseOver="afficheDescURL('tes')" onMouseOut="afficheDescURL(base)" >et</a>er sur un <a href="#" class="LienKeyword" onMouseOver="afficheDescURL('tes')" onMouseOut="afficheDescURL(base)" >écran</a> des <a href="#" class="LienKeyword" onMouseOver="afficheDescURL('tes')" onMouseOut="afficheDescURL(base)" >photographies</a> animées.
Septième art.
 
<a href="#" class="LienKeyword" onMouseOver="afficheDescURL('tes')" onMouseOut="afficheDescURL(base)" >salle</a> où l'on proj<a href="#" class="LienKeyword" onMouseOver="afficheDescURL('tes')" onMouseOut="afficheDescURL(base)" >et</a>te des films.</td>
    </tr>
    <tr>
    <td><div id="textDiv"><i>mots cles</i></div></td>
    <td><input type="hidden" name="regle" value="9"></td>
    <td align="right"><input class="Command" type="submit" value="Valider" name="envoyerKeywords"></td>
 
    </tr>
 </table>
 </form>
 
 </body>
 </html>

et la avec 'test'

Code html :

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
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
<div align="center">
bienvenue sur la maquette <br />
 
<a href='index.php?page=definition'>definition</a> <a href='index.php?page=add.keywords'>keywords</a> 
 
</div><br />
 
<div align="center">
Veuillez selectionner un mot cles, puis cliquez sur la fleche.<br />
Recommencez autant de fois que necessaire, puis enregistrez.<br />
 
<style type="text/css"> 
a.LienKeyword   {     
color:blue;    
text-decoration:none;
border-bottom-width: 2px;
border-bottom-style: dotted;
border-bottom-color: #blue;   }  
    
a.LienKeyword:hover   {     
/*font-style:italic;*/
}   
 
</style> 
 
<!-- script pour les bulles infos des mots cles -->
<script type="text/javascript"><!--
function afficheDescURL(toThis)
  {
  if (document.getElementById)
    {
    document.getElementById("textDiv").innerHTML = toThis;
    }
  else if (document.all)
    {
    document.all["textDiv"].innerHTML = toThis;
    }
  }
 
base = "<i>passez sur la souris pour lire un mot cle</i>";
afficheDescURL(base);
//--></script>
<!-- fin du script de l'info bulle -->
 
 
ID=9
</div>
 
 <html>
 <head>
 <title>Les Mots cles</title>
 
<!-- fonction pour envoyer la liste selectionne par defaut grace a JS -->
 <script language="javascript">
     function formsubmit () {
        var l = document.getElementById('Liste');
        for (var i=0; i < l.options.length; i++) l.options[ i ].selected = true;
        }
 </script>
<!-- fin script -->
 
 <script type="text/javascript">
 function getSelectedText(){
 if (window.getSelection){
 var str = window.getSelection();
 }else if (document.getSelection){
 var str = document.getSelection();
 }else {
 var str = document.selection.createRange().text;
 }
 return str;
 }
 function affichage(){
      var sel = getSelectedText();
     if (sel!=''){
        //ecriture dans champ 
        var liste = document.getElementById('Liste');
        liste.options[liste.options.length] = new Option(sel);
     }
     else{
        alert("Aucun mot cle selectionne !");
        return(false); 
     }
 }
 
 function Destroy(){
    if (document.getElementById("Liste").options.selectedIndex >= 0) {
    /* boucle tant qu'il reste des Ã©lÃ©ments sÃ©lectionnÃ©s */
        while (document.getElementById("Liste").options.selectedIndex >= 0) { 
            /* index de l'Ã©lÃ©ment sÃ©lectionnÃ© */
            index = document.getElementById("Liste").options.selectedIndex;
            /* suppression de l'Ã©lÃ©ment sÃ©lectionnÃ© dans la liste d'origine */
            document.getElementById("Liste").options[index] = null; 
            alert('le mot cle a ete supprime');
        }
    }
    else
        alert("Aucun mot cle selectionne !");
        return(false); 
 }
 </script>
 
 </head>
 <body>
 
 <!-- on fait une requete pour trouver lmes mots cles prÃ©sent dans le texte et pour les mettre en gras -->
 <!-- fin de requete mot cles -->
 
 <form name="form1" method="POST" action="index.php?page=add.keywords&action=saisie" class="#" onSubmit="return formsubmit();">
   <table border="1" align="center">
     <tr>
         <td id="selection" align="center" bgcolor="#CCCCCC" width="400">Definition</td>
        <td align="center" bgcolor="#CCCCCC">Action</td>
        <td align="center" bgcolor="#CCCCCC">Mots cles</td>
     </tr>
 
    <tr>
        <td><b>Titre: </b>Cinéma</td>
        <td rowspan="2" align="center"><input type="button" onClick="affichage()" value="Ajouter" /><br><input type="button" onClick="Destroy()" value="Supprimer" /></td>
      <td rowspan="2">  
        <select name="Liste[]" id="Liste" style="width:130" multiple="multiple"></select></td> 
    </tr>
 
 
</td>
    </tr>
 
    <tr>
        <!-- appel d'une fonction php qui corrige dans le texte les Maj/Min -->
        <td name="liste1">[abréviation de cinématographe] <a href="#" class="LienKeyword" onMouseOver="afficheDescURL('<a href="#" class="LienKeyword" onMouseOver="afficheDescURL('test')" onMouseOut="afficheDescURL(base)" >test</a>')" onMouseOut="afficheDescURL(base)" >procédé</a> qui perm<a href="#" class="LienKeyword" onMouseOver="afficheDescURL('<a href="#" class="LienKeyword" onMouseOver="afficheDescURL('test')" onMouseOut="afficheDescURL(base)" >test</a>')" onMouseOut="afficheDescURL(base)" >et</a> d'enregistrer <a href="#" class="LienKeyword" onMouseOver="afficheDescURL('<a href="#" class="LienKeyword" onMouseOver="afficheDescURL('test')" onMouseOut="afficheDescURL(base)" >test</a>')" onMouseOut="afficheDescURL(base)" >et</a> de proj<a href="#" class="LienKeyword" onMouseOver="afficheDescURL('<a href="#" class="LienKeyword" onMouseOver="afficheDescURL('test')" onMouseOut="afficheDescURL(base)" >test</a>')" onMouseOut="afficheDescURL(base)" >et</a>er sur un <a href="#" class="LienKeyword" onMouseOver="afficheDescURL('<a href="#" class="LienKeyword" onMouseOver="afficheDescURL('test')" onMouseOut="afficheDescURL(base)" >test</a>')" onMouseOut="afficheDescURL(base)" >écran</a> des <a href="#" class="LienKeyword" onMouseOver="afficheDescURL('<a href="#" class="LienKeyword" onMouseOver="afficheDescURL('test')" onMouseOut="afficheDescURL(base)" >test</a>')" onMouseOut="afficheDescURL(base)" >photographies</a> animées.
Septième art.
 
<a href="#" class="LienKeyword" onMouseOver="afficheDescURL('<a href="#" class="LienKeyword" onMouseOver="afficheDescURL('test')" onMouseOut="afficheDescURL(base)" >test</a>')" onMouseOut="afficheDescURL(base)" >salle</a> où l'on proj<a href="#" class="LienKeyword" onMouseOver="afficheDescURL('<a href="#" class="LienKeyword" onMouseOver="afficheDescURL('test')" onMouseOut="afficheDescURL(base)" >test</a>')" onMouseOut="afficheDescURL(base)" >et</a>te des films.</td>
    </tr>
    <tr>
    <td><div id="textDiv"><i>mots cles</i></div></td>
    <td><input type="hidden" name="regle" value="9"></td>
 
    <td align="right"><input class="Command" type="submit" value="Valider" name="envoyerKeywords"></td>
    </tr>
 </table>
 </form>
 
 </body>
 </html>

**Kerod** · 15/09/2008, 20h55

Déjà il doit avoir un gros souci de remplacement car tu es censé envoyer un id et tu te retrouves avec un lien dans l'appel de ta fonction, donc à revoir.

De plus, ce n'est pas du HTML très bien construit. On trouve un div en haut avec toutes balises HTML. Des styles et scripts un peu partout. Va pour les scripts mais le CSS...

Invité · 15/09/2008, 21h19

j'ai pas testé, mais devrait marcher

Code :

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

1
2
3
 
$bulle = "onMouseOver=\"afficheDescURL('{$row2[formule]}');\" onMouseOut=\"afficheDescURL(base);\" ";
$KeywordGras[]= "<a href=\"#\" class=\"LienKeyword\" {$bulle} >{$row2['nom']}</a>";

note: ne pas prendre le bout de code que tu as reçu par courriel, j'ai updaté celui sur le forum

**yanchasp** · 15/09/2008, 22h06

Envoyé par Luc Raymond

j'ai pas testé, mais devrait marcher

Code :

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

1
2
3
 
$bulle = "onMouseOver=\"afficheDescURL('{$row2[formule]}');\" onMouseOut=\"afficheDescURL(base);\" ";
$KeywordGras[]= "<a href=\"#\" class=\"LienKeyword\" {$bulle} >{$row2['nom']}</a>";

note: ne pas prendre le bout de code que tu as reçu par courriel, j'ai updaté celui sur le forum

Merci, mais ca n'a pas l'air de fonctionner.
voici ce que j'obtiens par exemple

procédé qui permet d'enregistrer et de projeter sur un et permettant de voir de la merde chez soit.');" onMouseOut="afficheDescURL(base);" >écran des photographies animées. Septième art. salle où l'on projette des films.

On voit un bout de code, mais ca me le fait pas pour toutes les defs.
En italique, bout de définition, et en gras bout de code.
Sinon quand je survole un mot clé, la def n'apparait pas, c'est vide.

Kerod, je sais c'est le bordel dans ma page, car g fait a la va vite plusieurs test et pas fait encore le ménage.

Invité · 16/09/2008, 00h06

prise 2

Code :

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

1
2
3
 
$bulle = "onMouseOver=\"afficheDescURL('{$row2[formule]}')\" onMouseOut=\"afficheDescURL(base)\" ";
$KeywordGras[]= "<a href=\"#\" class=\"LienKeyword\" {$bulle} >{$row2['nom']}</a>";

**Kerod** · 16/09/2008, 00h38

@Luc : tu auras beau donné un nouveau code des deux variables ça changera rien. Le souci ne vient pas de là mais plutôt du contenu.

@All : regardez ce code HTML :

Code html :

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

<a href="#" class="LienKeyword" onMouseOver="afficheDescURL('<a href="#" class="LienKeyword" onMouseOver="afficheDescURL('test')" onMouseOut="afficheDescURL(base)" >test</a>')" onMouseOut="afficheDescURL(base)" >salle</a> où l'on proj<a href="#" class="LienKeyword" onMouseOver="afficheDescURL('<a href="#" class="LienKeyword" onMouseOver="afficheDescURL('test')" onMouseOut="afficheDescURL(base)" >test</a>')" onMouseOut="afficheDescURL(base)" >et</a>te des films.

Vous voyez pas qu'il y a un souci de " ? Donc normal si de 1 ça marche pas et de deux que ça affiche le contenu de onmouseover.