admin管理员组

文章数量:1405148

I build HTML pages and I would like to let the user "print" the HTML to a PDF, without embedding the HREF links (because they link to an internal server, and I do not want the readers of the PDF to see these links).

In Chromium, the resulting PDF file embeds the href links.

Is is possible to remove the hrefs via CSS of Javascript?

I tried this:

<a class="no_print" href="javascript:printPreview()">Print Preview</a>

<script>
function printPreview() {
    var aTags = document.getElementsByTagName('a');
    var atl = aTags.length;
    var i;

    for (i = 0; i < atl; i++) {
        aTags[i].href = ''; 
    }
}
</script>

but is does not work.

-- edit: after the solution was found, here is a plete example --

<!DOCTYPE html>
<html><header>
    <title>x</title>
    <style>
        @media print { .no_print { display: none; }
    </style>
    <script>
function printPreview()
{
    var aTags = document.getElementsByTagName('a');
    var atl = aTags.length;
    var i;

    for (i = 0; i < atl; i++) {
        aTags[i].removeAttribute("href");   
    }
}
    </script>

</head>
<body>
    <a class="no_print" href="javascript:printPreview()">Print Preview</a>
    <br>
    <a href="">link to somewhere</a>
    <br>
    <a>anchor but no link</a>
    <br>
    other text...
</body>
</html>

I build HTML pages and I would like to let the user "print" the HTML to a PDF, without embedding the HREF links (because they link to an internal server, and I do not want the readers of the PDF to see these links).

In Chromium, the resulting PDF file embeds the href links.

Is is possible to remove the hrefs via CSS of Javascript?

I tried this:

<a class="no_print" href="javascript:printPreview()">Print Preview</a>

<script>
function printPreview() {
    var aTags = document.getElementsByTagName('a');
    var atl = aTags.length;
    var i;

    for (i = 0; i < atl; i++) {
        aTags[i].href = ''; 
    }
}
</script>

but is does not work.

-- edit: after the solution was found, here is a plete example --

<!DOCTYPE html>
<html><header>
    <title>x</title>
    <style>
        @media print { .no_print { display: none; }
    </style>
    <script>
function printPreview()
{
    var aTags = document.getElementsByTagName('a');
    var atl = aTags.length;
    var i;

    for (i = 0; i < atl; i++) {
        aTags[i].removeAttribute("href");   
    }
}
    </script>

</head>
<body>
    <a class="no_print" href="javascript:printPreview()">Print Preview</a>
    <br>
    <a href="http://example.">link to somewhere</a>
    <br>
    <a>anchor but no link</a>
    <br>
    other text...
</body>
</html>
  • javascript
  • html
  • css
Share Improve this question edited Jun 19, 2014 at 12:02 user803422 asked Jun 19, 2014 at 11:01 user803422user803422 2,8142 gold badges21 silver badges37 bronze badges 4
  • 1 put your .no_print css class inside @media print { ... } – Think Different Commented Jun 19, 2014 at 11:05
  • 1 It should probably be function printPreview() – putvande Commented Jun 19, 2014 at 11:06
  • 2 Yes use @media print { .no_print { display: none; } } in your css. Don't use javascript for this. – Pricey Commented Jun 19, 2014 at 11:08
  • 1 because they link to an internal server. Can they not see it on the actual website where they have to click print preview anyway? – putvande Commented Jun 19, 2014 at 11:12
Add a ment  | 

4 Answers 4

Reset to default 2

You can try below JS

 function printPreview() {
    document.getElementsByTagName('body a').each(function(index, element) {
     element.removeAttribute('href');
    });
}

the above code will remove href attribute for all anchor inside body.

Here is the code which works fine.

<html>
  <a class="no_print" href="javascript:printPreview()">Print Preview</a>

  <script>
  function printPreview() {
     var aTags = document.getElementsByTagName('a');
     var atl = aTags.length;
     var i;

     for (i = 0; i < atl; i++) {
        **aTags[i].removeAttribute("href");**
     }  
  }
  </script>    
</html>

Try sth. like that maybe?

HTML

<a class="no_print" href="javascript:printPreview">Print Preview</a>

JS

function printPreview() {
    document.getElementsByTagName('a').removeAttribute("href");
}

Pure css solution:

@media print {
    a:after {
        display: none !important;
    }
}

本文标签： javascripthow to remove href for quotprintingquot html to PDFStack Overflow

版权声明：本文标题：javascript - how to remove href for &quot;printing&quot; html to PDF? - Stack Overflow 内容由网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：http://www.betaflare.com/web/1744877239a2629991.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。