CODEWITHSUNDEEP
javascriptpdfhyperlink
rr007
rr007

Reputation: 13

How do I create a link to a pdf in javascript?

I am a newbie creating an eCommerce website using an XHTML template. I want to add a disclaimer under certain items, but not all. To avoid typing the disclaimer under every item (and avoid problems in the future if the disclaimer changes), I want to create a block of copy using javascript that when I point to it, the disclaimer is added. I have done so successfully (yah!), HOWEVER, in the disclaimer is a link to a pdf. When I use html to link to the pdf, it fails. I know it's probably because I don't have the proper syntax given that the html is "inside" the javascript code. Can someone help please?

Here's what I have:

//<![CDATA[
function openPDF(file)
{
window.open (file, 'resizable,scrollbars');
}
//]]>
</script>

<script type="text/javascript">
//<![CDATA[
onload=function()
{
var txt=document.getElementById("myDiv")
txt.innerHTML="Photos do not represent actual size. Refer to measurements for sizing.
Measurements are approximate. Colors shown may differ depending on your computer
settings. Colors described are subjective and colors may vary from piece to piece,
depending on the natural properties of the stones. To learn more, see our <a href="#" 
onClick="openPDF('www.shop.site.com/media/JewelryGuide.pdf')">Jewelry Guide</a>.";
}
//]]>
</script>

Here is the code I use to call it in:

<div id="myDiv"></div>`

Upvotes: 1

Views: 2115

Answers (2)

codebreaker
codebreaker

Reputation: 1485

Hi an function like as below would do the work i believe.. 

function openPdf(e, path) {
    // stop the browser from going to the href
    e = e || window.event; // for IE
    e.preventDefault(); 

    // launch a new window with your PDF
    window.open(path, 'somename', ... /* options */);

}

Hi i have done a small fiddle hope it helps... http://jsbin.com/aQUFota/1/edit

Upvotes: 1

Andy
Andy

Reputation: 63589

1) You had line breaks in that text string. 2) You need to escape a couple of your quotes. I chose to swap the quotes around and escape the ones around the filename.

txt.innerHTML = 'Photos do not represent actual size. Refer to measurements for sizing. Measurements are approximate. Colors shown may differ depending on your computer settings. Colors described are subjective and colors may vary from piece to piece, depending on the natural properties of the stones. To learn more, see our <a href="#" onClick="openPDF(\'www.shop.site.com/media/JewelryGuide.pdf\')">Jewelry Guide</a>.';

If you didn't want one long line you can break up the lines like so:

txt.innerHTML = 'Photos do not represent actual size.' +
'Refer to measurements for sizing. Measurements are approximate.' +
'Colors shown may differ depending on your computer settings.' +

Etc.

Or even:

txt.innerHTML = [
  'Photos do not represent actual size.',
  'Refer to measurements for sizing. Measurements are approximate.',
  'Colors shown may differ depending on your computer settings.'
].join('');

Upvotes: 0

Related Questions