Bonjour,

J'ai un problème de compatibilité entre mon filtre XSL et du code Javascript.

J'ai utilisé Dreamweaver pour créer des pages et ajouter des comportements en Javascript (roll-over sur des boutons, affichage et masquage de calques). Cela fonctionne très bien sous Dreamweaver.

Mais dès que je met le code Javascript dans mon filtre XSL (balise script), mon navigateur affiche obstinément une page vide.

J'ai exactement le même résultat si je place mon Javascript dans un fichier externe que j'appelle depuis mon XSL.


Quelqu'un peut-il m'aider? Merci d'avance.


Voici mon filtre XSL avec mon Javascript (désolé pour la longueur).

<?xml version="1.0" encoding="UTF-8"?> 
<xsl:stylesheet extension-element-prefixes="exsl" xmlns:xsl="http://www.w3.org/1999/XSL/Transform" 
xmlns:exsl="http://exslt.org/common" version="1.1"> 

<xsl:output doctype-public="-//W3C//DTD XHTML 1.1//EN" 
doctype-system="http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd" encoding="iso-8859-1" 
indent="yes" method="xml" version="1.1"/> 

<xsl:template match="infos_pratiques"> 
<html> 
<head> 
<title> 
<xsl:value-of select="titre"/> 
</title> 

<link href="css/frame.css" media="screen" rel="stylesheet" type="text/css"/> 

<script type="text/javascript"> 
<!-- 
function MM_preloadImages() { //v3.0 
var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array(); 
var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++) 
if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}} 
} 

function MM_swapImgRestore() { //v3.0 
var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc; 
} 

function MM_findObj(n, d) { //v4.01 
var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) { 
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);} 
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n]; 
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document); 
if(!x && d.getElementById) x=d.getElementById(n); return x; 
} 

function MM_swapImage() { //v3.0 
var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3) 
if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];} 
} 
function MM_showHideLayers() { //v9.0 
var i,p,v,obj,args=MM_showHideLayers.arguments; 
for (i=0; i<(args.length-2); i+=3) 
with (document) if (getElementById && ((obj=getElementById(args[i]))!=null)) { v=args[i+2]; 
if (obj.style) { obj=obj.style; v=(v=='show')?'visible' [decu]v=='hide')?'hidden':v; } 
obj.visibility=v; } 
} 
//--> 
</script> 



</head> 
<body 
onload="MM_preloadImages('elements_graphiques/lettres_hover/lettres_hover_02.gif','elements_graphiques/lettres_hover/lettres_hover_03.gif');MM_showHideLayers('a2','','hide','b2','','hide','c2','','hide','d2','','hide','e2','','hide','f2','','hide','g2','','hide','h2','','hide','i2','','hide','j2','','hide','k2','','hide','l2','','hide','m2','','hide','n2','','hide','o2','','hide','p2','','hide','q2','','hide','r2','','hide','s2','','hide','t2','','hide','u2','','hide','v2','','hide','w2','','hide','x2','','hide','y2','','hide','z2','','hide')"> 
<xsl:apply-templates/> 
<div id="lettres"> 
<xsl:call-template name="alphabet"/> 
</div> 

</body> 
</html> 
</xsl:template> 


<xsl:template match="fil_dariane"> 
<div id="breadCrumb"> 
<p><a href="accueil.html">Accueil</a> / <xsl:value-of select="/*/titre"/> 
</p> 
</div> 
</xsl:template> 

<xsl:template match="infos_pratiques/titre"> 
<h3> 
<xsl:value-of select="self::node()"/> 
</h3> 
</xsl:template> 

<xsl:template match="corps_de_page"> 
<table> 
<xsl:apply-templates/> 
</table> 
</xsl:template> 

<xsl:template match="ligne"> 
<tr> 
<xsl:apply-templates/> 
</tr> 
</xsl:template> 

<xsl:template match="logo"> 
<td> 
<img src="{@src}" alt="{@alt}" width="84" height="84"/> 
</td> 
</xsl:template> 

<xsl:template match="bloc_texte"> 
<td> 
<xsl:apply-templates/> 
</td> 
</xsl:template> 

<xsl:template match="bloc_texte/titre"> 
<h4> 
<xsl:value-of select="self::node()"/> 
</h4> 
</xsl:template> 

<xsl:template match="item"> 
<xsl:variable name="target_name"> 
<xsl:value-of select="concat('items/',@id,'.html')"/> 
</xsl:variable> 
<span> 
<a href="{$target_name}" target="_blank"> 
<xsl:value-of select="titre"/> 
</a> | </span> 

<xsl:variable name="file_name"> 
<xsl:value-of select="concat('items/',@id,'.html')"/> 
</xsl:variable> 
<exsl:document href="{$file_name}" indent="yes" encoding="iso-8859-1" 
doctype-public="-//W3C//DTD XHTML 1.1//EN" 
doctype-system="http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd" version="1.1"> 

<head> 
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"/> 
<title> 
<xsl:value-of select="titre"/> 
</title> 
<link href="../css/frame.css" media="screen" rel="stylesheet" type="text/css"/> 
</head> 
<body> 
<xsl:apply-templates/> 
</body> 
</exsl:document> 
</xsl:template> 

<xsl:template match="item/titre"> 
<h3> 
<xsl:value-of select="self::node()"/> 
</h3> 


</xsl:template> 

<xsl:template match="item/para"> 
<p> 
<xsl:value-of select="self::node()"/> 
</p> 
</xsl:template> 

<xsl:template match="lien"> 
<span> 
<a href="" target="_blank"> 
<xsl:value-of select="self::node()"/> 
</a> 
</span> 
</xsl:template> 

<xsl:template name="alphabet"> 
<br/> 
<div class="calque" id=""> 
<xsl:for-each select="/item/titre"> 
<span> 
<xsl:value-of select="item/titre"/> 
</span> 
</xsl:for-each> 
</div> 

<img src="elements_graphiques/lettres/lettres_01.gif"/> 
<div id="a" class="lettre"> 
<img src="elements_graphiques/lettres/lettres_02.gif" id="Image1" 
onmouseover="MM_swapImage('Image1','','elements_graphiques/lettres_hover/lettres_hover_02.gif',1);MM_showHideLayers('a2','','show')" 
onmouseout="MM_swapImgRestore();MM_showHideLayers('a2','','hide')"/> 
</div> 
<div id="b" class="lettre"> 
<img src="elements_graphiques/lettres/lettres_03.gif" id="Image2" 
onmouseover="MM_swapImage('Image2','','elements_graphiques/lettres_hover/lettres_hover_03.gif',1);MM_showHideLayers('b2','','show')" 
onmouseout="MM_swapImgRestore();MM_showHideLayers('b2','','hide')"/> 
</div> 
<div id="c" class="lettre"> 
<img src="elements_graphiques/lettres/lettres_04.gif" id="Image3" 
onmouseover="MM_swapImage('Image3','','elements_graphiques/lettres_hover/lettres_hover_04.gif',1);MM_showHideLayers('c2','','show')" 
onmouseout="MM_swapImgRestore();MM_showHideLayers('c2','','hide')"/> 
</div> 
<div id="d" class="lettre"> 
<img src="elements_graphiques/lettres/lettres_05.gif" id="Image4" 
onmouseover="MM_swapImage('Image4','','elements_graphiques/lettres_hover/lettres_hover_05.gif',1);MM_showHideLayers('d2','','show')" 
onmouseout="MM_swapImgRestore();MM_showHideLayers('d2','','hide')"/> 
</div> 
<div id="e" class="lettre"> 
<img src="elements_graphiques/lettres/lettres_06.gif" id="Image5" 
onmouseover="MM_swapImage('Image5','','elements_graphiques/lettres_hover/lettres_hover_06.gif',1);MM_showHideLayers('e2','','show')" 
onmouseout="MM_swapImgRestore();MM_showHideLayers('e2','','hide')"/> 
</div> 
<div id="f" class="lettre"> 
<img src="elements_graphiques/lettres/lettres_07.gif" id="Image6" 
onmouseover="MM_swapImage('Image6','','elements_graphiques/lettres_hover/lettres_hover_07.gif',1);MM_showHideLayers('f2','','show')" 
onmouseout="MM_swapImgRestore();MM_showHideLayers('f2','','hide')"/> 
</div> 
<div id="g" class="lettre"> 
<img src="elements_graphiques/lettres/lettres_08.gif" id="Image7" 
onmouseover="MM_swapImage('Image7','','elements_graphiques/lettres_hover/lettres_hover_08.gif',1);MM_showHideLayers('g2','','show')" 
onmouseout="MM_swapImgRestore();MM_showHideLayers('g2','','hide')"/> 
</div> 
<div id="h" class="lettre"> 
<img src="elements_graphiques/lettres/lettres_09.gif" id="Image8" 
onmouseover="MM_swapImage('Image8','','elements_graphiques/lettres_hover/lettres_hover_09.gif',1);MM_showHideLayers('h2','','show')" 
onmouseout="MM_swapImgRestore();MM_showHideLayers('h2','','hide')"/> 
</div> 
<div id="i" class="lettre"> 
<img src="elements_graphiques/lettres/lettres_10.gif" id="Image9" 
onmouseover="MM_swapImage('Image9','','elements_graphiques/lettres_hover/lettres_hover_10.gif',1);MM_showHideLayers('i2','','show')" 
onmouseout="MM_swapImgRestore();MM_showHideLayers('i2','','hide')"/> 
</div> 
<div id="j" class="lettre"> 
<img src="elements_graphiques/lettres/lettres_11.gif" id="Image10" 
onmouseover="MM_swapImage('Image10','','elements_graphiques/lettres_hover/lettres_hover_11.gif',1);MM_showHideLayers('j2','','show')" 
onmouseout="MM_swapImgRestore();MM_showHideLayers('j2','','hide')"/> 
</div> 
<div id="k" class="lettre"> 
<img src="elements_graphiques/lettres/lettres_12.gif" id="Image11" 
onmouseover="MM_swapImage('Image11','','elements_graphiques/lettres_hover/lettres_hover_12.gif',1);MM_showHideLayers('k2','','show')" 
onmouseout="MM_swapImgRestore();MM_showHideLayers('k2','','hide')"/> 
</div> 
<div id="l" class="lettre"> 
<img src="elements_graphiques/lettres/lettres_13.gif" id="Image12" 
onmouseover="MM_swapImage('Image12','','elements_graphiques/lettres_hover/lettres_hover_13.gif',1);MM_showHideLayers('l2','','show')" 
onmouseout="MM_swapImgRestore();MM_showHideLayers('l2','','hide')"/> 
</div> 
<div id="m" class="lettre"> 
<img src="elements_graphiques/lettres/lettres_14.gif" id="Image13" 
onmouseover="MM_showHideLayers('m2','','show');MM_swapImage('Image13','','elements_graphiques/lettres_hover/lettres_hover_14.gif',1)" 
onmouseout="MM_swapImgRestore();MM_showHideLayers('m2','','hide')"/> 
</div> 
<div id="n" class="lettre"> 
<img src="elements_graphiques/lettres/lettres_15.gif" id="Image14" 
onmouseover="MM_swapImage('Image14','','elements_graphiques/lettres_hover/lettres_hover_15.gif',1);MM_showHideLayers('n2','','show')" 
onmouseout="MM_swapImgRestore();MM_showHideLayers('n2','','hide')"/> 
</div> 
<div id="o" class="lettre"> 
<img src="elements_graphiques/lettres/lettres_16.gif" id="Image15" 
onmouseover="MM_swapImage('Image15','','elements_graphiques/lettres_hover/lettres_hover_16.gif',1);MM_showHideLayers('o2','','show')" 
onmouseout="MM_swapImgRestore();MM_showHideLayers('o2','','hide')"/> 
</div> 
<div id="p" class="lettre"> 
<img src="elements_graphiques/lettres/lettres_17.gif" id="Image16" 
onmouseover="MM_swapImage('Image16','','elements_graphiques/lettres_hover/lettres_hover_17.gif',1);MM_showHideLayers('p2','','show')" 
onmouseout="MM_swapImgRestore();MM_showHideLayers('p2','','hide')"/> 
</div> 
<div id="q" class="lettre"> 
<img src="elements_graphiques/lettres/lettres_18.gif" id="Image17" 
onmouseover="MM_swapImage('Image17','','elements_graphiques/lettres_hover/lettres_hover_18.gif',1);MM_showHideLayers('q2','','show')" 
onmouseout="MM_swapImgRestore();MM_showHideLayers('q2','','hide')"/> 
</div> 
<div id="r" class="lettre"> 
<img src="elements_graphiques/lettres/lettres_19.gif" id="Image18" 
onmouseover="MM_swapImage('Image18','','elements_graphiques/lettres_hover/lettres_hover_19.gif',1);MM_showHideLayers('r2','','show')" 
onmouseout="MM_swapImgRestore();MM_showHideLayers('r2','','hide')"/> 
</div> 
<div id="s" class="lettre"> 
<img src="elements_graphiques/lettres/lettres_20.gif" id="Image19" 
onmouseover="MM_swapImage('Image19','','elements_graphiques/lettres_hover/lettres_hover_20.gif',1);MM_showHideLayers('s2','','show')" 
onmouseout="MM_swapImgRestore();MM_showHideLayers('s2','','hide')"/> 
</div> 
<div id="t" class="lettre"> 
<img src="elements_graphiques/lettres/lettres_21.gif" id="Image20" 
onmouseover="MM_swapImage('Image20','','elements_graphiques/lettres_hover/lettres_hover_21.gif',1);MM_showHideLayers('t2','','show')" 
onmouseout="MM_swapImgRestore();MM_showHideLayers('t2','','hide')"/> 
</div> 
<div id="u" class="lettre"> 
<img src="elements_graphiques/lettres/lettres_22.gif" id="Image21" 
onmouseover="MM_swapImage('Image21','','elements_graphiques/lettres_hover/lettres_hover_22.gif',1);MM_showHideLayers('u2','','show')" 
onmouseout="MM_swapImgRestore();MM_showHideLayers('u2','','hide')"/> 
</div> 
<div id="v" class="lettre"> 
<img src="elements_graphiques/lettres/lettres_23.gif" id="Image22" 
onmouseover="MM_swapImage('Image22','','elements_graphiques/lettres_hover/lettres_hover_23.gif',1);MM_showHideLayers('v2','','show')" 
onmouseout="MM_swapImgRestore();MM_showHideLayers('v2','','hide')"/> 
</div> 
<div id="w" class="lettre"> 
<img src="elements_graphiques/lettres/lettres_24.gif" id="Image23" 
onmouseover="MM_swapImage('Image23','','elements_graphiques/lettres_hover/lettres_hover_24.gif',1);MM_showHideLayers('w2','','show')" 
onmouseout="MM_swapImgRestore();MM_showHideLayers('w2','','hide')"/> 
</div> 
<div id="x" class="lettre"> 
<img src="elements_graphiques/lettres/lettres_25.gif" id="Image24" 
onmouseover="MM_swapImage('Image24','','elements_graphiques/lettres_hover/lettres_hover_25.gif',1);MM_showHideLayers('x2','','show')" 
onmouseout="MM_swapImgRestore();MM_showHideLayers('x2','','hide')"/> 
</div> 
<div id="y" class="lettre"> 
<img src="elements_graphiques/lettres/lettres_26.gif" id="Image25" 
onmouseover="MM_swapImage('Image25','','elements_graphiques/lettres_hover/lettres_hover_26.gif',1);MM_showHideLayers('y2','','show')" 
onmouseout="MM_swapImgRestore();MM_showHideLayers('y2','','hide')"/> 
</div> 
<div id="z" class="lettre"> 
<img src="elements_graphiques/lettres/lettres_27.gif" id="Image26" 
onmouseover="MM_swapImage('Image26','','elements_graphiques/lettres_hover/lettres_hover_27.gif',1);MM_showHideLayers('z2','','show')" 
onmouseout="MM_swapImgRestore();MM_showHideLayers('z2','','hide')"/> 
</div> 
<img src="elements_graphiques/lettres/lettres_28.gif"/> 
</xsl:template> 



</xsl:stylesheet>
[/i][/i][/i][/i][/i][/i][/i]


Note de modération :
Merci à l'avenir de mettre vos codes entre les balises prévues à cet effet, en accord avec la règle 13 que vous avez acceptez en vous inscrivant sur ce forum, ceci dans un soucis de confort de lecture.
A noter qu'une page en ligne serait certainement plus judicieuse, que ces kilomètres de codes que je n'ai pour ma part pas envie de lire Smiley cligne

Modifié par 6l20 (26 Aug 2008 - 20:04)
Pour ma part j'ai résolu ce problème en incluant la balise script et son contenu dans un CDATA.
Modérateur
Hello,

Si tu te sers d'un fichier JS externe, le marquage <!-- ... //--> n'a pas à apparaitre au sein de ce fichier.

En revanche, pour un script en ligne, on peut (en dehors du CDATA) obtenir le résultat souhaité avec :
<script type="text/javascript"><xsl:comment>
...
//<xsl:comment></script>


PS : Les sauts de ligne dans le code ci-dessus doivent être conservés.
Modifié par koala64 (28 Aug 2008 - 01:35)