Jquery - Escaping Quotes Issue When Prepending Content

I'm trying to use the following snippet: $('#thirdPartyCheckoutButtons').prepend('

Solution 1:

the inner-inner double quotes are breaking your onclick attribute value. Replace them with single quotes and escape them.

...onclick="window.open(\'https://seals.resellerratings.com/landing.php?seller=myID\',\'name\',\'height=760,width=780,scrollbars=1\'); return false;"...

The same thing happens on your oncontextmenu event, perform the same fix.

...oncontextmenu="alert(\'Copying Prohibited by Law - ResellerRatings seal is a Trademark of All Enthusiast, Inc.\'); return false;"/>...

full code:

$('#thirdPartyCheckoutButtons').prepend('<a href="https://www.resellerratings.com" onclick="window.open(\'https://seals.resellerratings.com/landing.php?seller=myID\',\'name\',\'height=760,width=780,scrollbars=1\'); return false;"><img style="border:none;" src="//seals.resellerratings.com/seal.php?seller=myID" oncontextmenu="alert(\'Copying Prohibited by Law - ResellerRatings seal is a Trademark of All Enthusiast, Inc.\'); return false;"/></a><img src="https://www.myurl.com/hdsd834k.png"  style="float: left;margin-left: 180px;">');​

Solution 2:

Your string in the prepend() function is delimited by single quotes. This means that every single quote you type inside of that string must be escaped by a . However, this is not your problem. Your problem lies with invalid HTML. This is what you have:

$('#thirdPartyCheckoutButtons').prepend('<ahref="https://www.resellerratings.com"onclick="window.open("https://seals.resellerratings.com/landing.php?seller=myID","name","height=760,width=780,scrollbars=1"); returnfalse;"><imgstyle="border:none;"src="//seals.resellerratings.com/seal.php?seller=myID"oncontextmenu="alert("CopyingProhibitedbyLaw-ResellerRatingssealisaTrademarkofAllEnthusiast, Inc."); returnfalse;" /></a><imgsrc="https://www.myurl.com/hdsd834k.png"style="float: left;margin-left: 180px;">');

If you notice all of your HTML attribute values are delimited by double-quotes. However, in your onclick="" event, you are using double-quotes again. You can use ESCAPED single-quotes to remedy this collision. You also have the same problem in your oncontextmenu="" event.

$('#thirdPartyCheckoutButtons').prepend('<a href="https://www.resellerratings.com" onclick="window.open(\'https://seals.resellerratings.com/landing.php?seller=myID\',\'name\',\'height=760,width=780,scrollbars=1\'); return false;"><img style="border:none;" src="//seals.resellerratings.com/seal.php?seller=myID" oncontextmenu="alert(\'Copying Prohibited by Law - ResellerRatings seal is a Trademark of All Enthusiast, Inc.\'); return false;"/></a><img src="https://www.myurl.com/hdsd834k.png"  style="float: left;margin-left: 180px;">');

The easiest way to avoid this problem in the future is to build the string (HTML) outside the jQuery function call and then pass the string in as a variable.

Share