XSL Variable passed to JavaScript code

Question

I've seen that similar questions were asked, but none helped.

I have a variable, called 'var':

<xsl:variable name="var">
  val
</xsl:variable>

And I want to use it as such:

<a onclick=
  "
    this.innerHTML = 'my var = ??? '/>;
  "
>
  click-Me
</a>

The problem: Replace ??? with var's value.

I've tried setting {$var} as well as <xsl:value-of select="$var"/>, but the latest won't work since there are three nested brackets.

Answer 1

My suggestion would be the following. First I would make a hidden div to hold the content of the xsl var:

<div style="display:none" id="content-div">
     <xsl:value-of select="$var"/>
</div>

Then bind a click event (not inline) to the link as follows:

<a id="some-link">
  click-Me
</a>

<script>
     document.getElementById('some-link').onclick = function(){
          this.innerHTML = document.getElementById('content-div').innerHTML;
     };
</script>