Want to win a PS4? Go Premium and enter to win our High-Tech Treats giveaway. Enter to Win

x
?
Solved

JavaScript: using quotation marks inside onload event

Posted on 2011-03-11
3
Medium Priority
?
350 Views
Last Modified: 2012-05-11
My code below works, however I want to place a pair of double quotes around the image in the onload event.


This:
src=http://mirrors.creativecommons.org/blimg/wikimedia-commons-poty-2007.jpg

Should be this:
src="http://mirrors.creativecommons.org/blimg/wikimedia-commons-poty-2007.jpg"

When I add the quotation marks, the image breaks.  I do not want to use single quotes for this-- I want to know how I can escape and use double quotes.

This does NOT work:
src=\"http://mirrors.creativecommons.org/blimg/wikimedia-commons-poty-2007.jpg\"





<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Demo</title>
</head>
<body>

<div id="xyz"></div>

<script type="text/javascript">
/*<![CDATA[*/

document.write('<img src="http://mirrors.creativecommons.org/blimg/wikimedia-commons-poty-2007.jpg" onload="document.getElementById(\'xyz\').innerHTML=\'<img src=http://mirrors.creativecommons.org/blimg/wikimedia-commons-poty-2007.jpg />\'" alt="Load Image" />');

/*]]>*/
</script>

</body>
</html>

Open in new window

0
Comment
Question by:hankknight
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
3 Comments
 
LVL 15

Expert Comment

by:Tomarse111
ID: 35112713
Have you tried using double double quotes as in ""yourimage"". It should escape them?
0
 
LVL 16

Accepted Solution

by:
sjklein42 earned 2000 total points
ID: 35112768
Trick is to quote it so that it is a runtime expression, and use Chr(34) to insert the double quotes:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Demo</title>
</head>
<body>

<div id="xyz"></div>

<script type="text/javascript">
/*<![CDATA[*/

document.write('<img src="http://mirrors.creativecommons.org/blimg/wikimedia-commons-poty-2007.jpg" onload="document.getElementById(\'xyz\').innerHTML=\'<img src=\'+String.fromCharCode(34)+\'http://mirrors.creativecommons.org/blimg/wikimedia-commons-poty-2007.jpg\'+String.fromCharCode(34)+\' />\'" alt="Load Image" />');

/*]]>*/
</script>

</body>
</html>

Open in new window

0
 
LVL 82

Expert Comment

by:leakim971
ID: 35112799
you may use :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Demo</title>
</head>
<body>

<div id="xyz"></div>

<script type="text/javascript">
/*<![CDATA[*/

document.write("<img src=\"http://mirrors.creativecommons.org/blimg/wikimedia-commons-poty-2007.jpg\" onload=\"document.getElementById('xyz').innerHTML='<img src=http://mirrors.creativecommons.org/blimg/wikimedia-commons-poty-2007.jpg />'\" alt=\"Load Image\" />");

/*]]>*/
</script>

</body>
</html>

Open in new window

0

Featured Post

Industry Leaders: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

In my daily work (mainly using ASP.net), I need to write a lot of JavaScript code. One of the most repetitive tasks I do are the jQuery Ajax calls. You know: (CODE) I don't know if for you it's the same, but for me is soooo tedious to write the …
In this blog, we’ll look at how improvements to Percona XtraDB Cluster improved IST performance.
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

609 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question