how to pass embed code in javascript

Question

<a href="" onClick="return select_item(<embed src=\"player.swf\" allowfullscreen=\"true\" quality=\"high\" pluginspage=\"http://www.macromedia.com/go/getflashplayer\" FlashVars=\"id=&flv=1257568908_.flv\" type=\"application/x-shockwave-flash\" width=\"450\" height=\"371\"></embed>')>

The above returns an "unterminated string literal" error.

How to solve this issue. This function is inside smarty template.

Thanks for every answer

Answer 1

the first thing i see is your final )' closing the select item is missing

most likely you'll have to escape your inner "'s too.

Answer 2

If you get

unterminated string literal

then it basically means that you have started a String, but never ended it. E.g.

var foo = "bar;

Solution is obvious: terminate it:

var foo = "bar";

Another common cause is using the same quotes inside the String as with which the String is wrapped:

var foo = "my mom said "go out!" to me";

You need to escape such quotes then:

var foo = "my mom said \"go out!\" to me";

In your specific case you have " inside the HTML string which is on its turn wrapped inside another "s of the onclick attribute. So:

<a href="" onClick="return select_item('<embed src="player.swf" ...

needs to be replaced by

<a href="" onClick="return select_item('<embed src=\"player.swf\" ...

Answer 3

It looks like ') is missing at the end of your onClick event, hence the JavaScript error. You also need to escape the double quotes. The line should look like:

<a href="" onClick="return select_item('<embed src=\"player.swf\" allowfullscreen=\"true\" quality=\"high\" pluginspage=\"http://www.macromedia.com/go/getflashplayer\" FlashVars=\"id=&flv=1257568908_.flv\" type=\"application/x-shockwave-flash\" width=\"450\" height=\"371\">');">

Answer 4

I've also run into situations with Smarty where it tries to evaluate Javascript as Smarty template code.

In that case, you need to surround the Javascript with {literal}{/literal} tags.

---

However, in your case, I think you're missing a single-quote at the beginning of select_item( and a double-quote at the end of the onClick event:

<a href="" onClick="return select_item('<embed src=\"player.swf\" allowfullscreen=\"true\" quality=\"high\" pluginspage=\"http://www.macromedia.com/go/getflashplayer\" FlashVars=\"id=&flv=1257568908_.flv\" type=\"application/x-shockwave-flash\" width=\"450\" height=\"371\"></embed>')">

I'm not 100% sure if you really need to backslash-escape the double-quotes that are part of the <embed HTML.

For that amount of markup, I find it easier to read and debug if you don't do it inline as part of the onClick event. I use PrototypeJS so I'd handle it like this

<a href="#" id="doSelectItem">Click Here</a>


//Handle the click event of the above a tag
Event.observe($('doSelectItem'), 'click', function(event) {
  var markup = '<embed src=\"player.swf\" allowfullscreen=\"true\" quality=\"high\" pluginspage=\"http://www.macromedia.com/go/getflashplayer\" FlashVars=\"id=&flv=1257568908_.flv\" type=\"application/x-shockwave-flash\" width=\"450\" height=\"371\"></embed>';

  if( select_item(markup) ) {
    //select_item returns true, so let the click event continue
  }else {
    //select_item returned false so cancel the click event.
    Event.stop(event);
  }
});

Answer 5

There is so much confusion about escaping quotes in javascript and HTML, especially when they are mixed like this.

Straight off the bat, try to avoid this situation in the first place. HTML is for markup, Javascript is for behaviours. That said...

In Javascript, you escape quotes with a backslash. This is so that when javascript interprets the string it knows where it ends.

var name = 'O\'Reilly';

In HTML, you use ampersands and a character code.

O"Reilly

Just remember that when you are writing code in your HTML, it's not being interpreted by javascript, it's being interpreted by the HTML parser. To a HTML parser, a backslash is just a regular character.

<a onclick="foo(&quot;bar&quot;);">

Now you see why I'd recommend avoiding the situation in the first place. Here's the alternative:

<a id="myLink">

<script type="text/javascript">
    document.getElementById('myLink').onclick = function() {
        foo('bar');
    };
</script>