0

I am not very good with javascript codes so if someone can help me I would appreciate it

I'm trying to hide all the elements "Button" after use innerHTML. My current code is this below and I can not figure out how to make it work.

<script>
 function print() {
    var content = document.getElementById('search_result').innerHTML;
    new_page = window.open('about:blank');
    new_page.document.write(content);
    new_page.window.print();
    new_page.window.close();
 }
</script>
Caio Morais
  • 29
  • 5
  • There's no any `button` elements on your page. Provide complete code. – kind user Mar 06 '17 at 20:52
  • 1
    Based on your use case, you may also use a different CSS style sheet that targets pages to print. The CSS used for printer would have `display: none;` for the `button` tag. The extra bonus is not messing with DOM nodes and having to show them after you return from your child window. See this [Smashing Magazine article](https://www.smashingmagazine.com/2015/01/designing-for-print-with-css/) and [Mozilla Developer Network's page](https://developer.mozilla.org/en-US/docs/Web/CSS/@page) on the subject. – Sumi Straessle Mar 06 '17 at 20:55

1 Answers1

0
<script>
  function print() {
    var content = document.getElementById('search_result');
    setButtonsDisplay(content, 'none');
    new_page = window.open('about:blank');
    new_page.document.write(content.innerHTML);
    setButtonsDisplay(content, '');
    new_page.window.print();
    new_page.window.close();
  }

  function setButtonsDisplay (elm, prop) {
    var btns = elm.getElementsByTagName('button');
    for (var i = 0; i < btns.length; i++) {
      btns[i].style.display = prop;
    }
  }
</script>
giorni
  • 157
  • 1
  • 8