问题
I'm trying to use the following snippet:
$('#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;">');
It isn't displaying at all.. I've tried so many quote differences, I don't get it!
回答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;">');
回答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('<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;">');
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.
来源：https://stackoverflow.com/questions/10955208/jquery-escaping-quotes-issue-when-prepending-content