String problems with Javascript double quotes inside single

Question

This is my code:

<script>
    function popupTest(title) {
        alert(title);
        return false;
    }
</script>

<a href="" onclick="return popupTest('This is &#039;some&#039; &quot;test&quot; string')"><span>Recommend</span></a>

Using Firefox 4 I get the error:

Error: missing ) after argument list
Source Code:
return popupTest('This is 'some' "test" string')

It's like it's decoding the HTML entities but I don't know why.

Have also tried...

<a href="" onclick="return popupTest('This is \'some\' \"test\" string')"><span>Recommend</span></a>

Which gives error:

Error: unterminated string literal
Source Code:
return popupTest('This is \'some\' \

Answer 1

' is HTML for '. So for the first example the HTML is parsed and the JavaScript engine is passed:

return popupTest('This is 'some' "test" string')

… and the second ' terminates the string.

On the other hand:

onclick="return popupTest('This is \'some\' \"test\" string')"

Is parsed as:

An onclick attribute with the value return popupTest('This is \'some\' \ followed by some invalid data.

You need to deal with the JavaScript first:

return popupTest('This is \'some\' "test" string')

and then escape it for HTML:

onclick="return popupTest('This is \'some\' "test" string')"

You would probably be better off using unobtrusive JavaScript and binding the event handlers with JavaScript instead of using intrinsic event attributes.