Skip to content
Related Articles

Related Articles

HTML | DOM onbeforeprint Event

Improve Article
Save Article
  • Difficulty Level : Basic
  • Last Updated : 10 Mar, 2022
Improve Article
Save Article

The onbeforeprint event occurs when a user gives a command to print a page. A dialog box will display just before printing the page. The onbeforeprint event is the opposite of the onafterprint event.
Supported Tags

Syntax: 
 

  • In HTML: 
     
<element onbeforeprint="myScript">
  • In JavaScript: 
     
object.onbeforeprint = function(){myScript};
  • In JavaScript, using the addEventListener() method: 
     
object.addEventListener("beforeprint", myScript);

Below examples illustrate the onbeforeprint Event in HTML DOM:
 

  • Example: Using HTML 
     

html




<!DOCTYPE html>
<!DOCTYPE html>
<html>
 
<body onbeforeprint="myFunction()">
    <center>
        <h1 style="color:green">
          GeeksforGeeks
      </h1>
         
 
<p>Try to print this page you will see a alert</p>
 
 
        <script>
            function myFunction() {
                alert("You are going to print this page");
            }
        </script>
    </center>
</body>
 
</html>

  • Output: 
    After giving the print command: 
     

  • Example: Using javascript 
     

html




<!DOCTYPE html>
<html>
 
<body>
    <center>
        <h1 style="color:green">
          GeeksforGeeks
      </h1>
         
 
<p>Try to print this page you will see a alert</p>
 
 
        <script>
            document.getElementsByTagName("BODY")[0].onbeforeprint = function() {
                myFunction()
            };
 
            function myFunction() {
                alert("You are going to print this page");
            }
        </script>
  </center>
</body>
 
</html>

  • Output: 
    After giving the print command: 
     

  • Example: In JavaScript, using the addEventListener() method: 
     

html




<!DOCTYPE html>
<html>
 
<body>
    <center>
        <h1 style="color:green">
          GeeksforGeeks
      </h1>
         
 
<p>Try to print this page you will see a alert</p>
 
 
 
        <script>
            window.addEventListener("beforeprint", myFunction);
 
            function myFunction() {
                alert("You are going to print this page");
            }
        </script>
    </center>
</body>
 
</html>

  • Output: 
    After giving the print command: 
     

Supported Browsers: The browser supported by HTML DOM onbeforeprint event are listed below: 
 

  • Google Chrome 63.0
  • Internet Explorer
  • Firefox

 


My Personal Notes arrow_drop_up
Related Articles

Start Your Coding Journey Now!