How to simulate target="_blank" in JavaScript ?


The onclick event occurs only when a user clicks the elements and it is a purely JavaScript attribute. Whenever you click on the onclick event it does some actions like displaying a message or redirects the user another page. The onclick event must be used very less in the website, because it may create the confuse to the users. So, use these event very wisely.

The window.open() method is used to open the links or web pages in a new window or tab in the browser. It is supported by all the famous browsers like chrome, firefox, and opera. window.open() is a pre-defined method of JavaScript. It is completely depends on the settings of the browser and the values which are assigned to the parameters.

In this article, we are going to learn how to simulate target=”_blank” in the JavaScript.

Syntax

The following is the syntax for the window.open() method −

window.open(URL, name, specs, replace)

Parameter

  • URL − Specifies the URL of the page which needs to be open in the new tab. Suppose, if URL is not defined then a blank new tab is opened.

  • name − Used to set the window name

  • specs − It is used to separate the items, no whitespace by comma

  • replace − It creates a new entry or replaces the current list.

The above all the optional parameters.

Steps

Follow the below-given steps to simulate a click in JavaScript −

Step 1 − Under the body section, we defined the heading, anchor, and script elements.

Step 2 − For the anchor element, the blankFun() method is defined. Using this method link will open in new tab when we click the link.

Step 3 − The window.open method is used to set the link open in the new window tab.

Step 4 − After clicking the link, the onClick event function is triggers and it opens the link in new window tab.

Example

In this example, we are going to see how we can count the number of clicks whenever we click the button.

<html> 
   <body> 
   <h2>Simulate target="_blank" in JavaScript</h2>
   <a href="#" onclick="blankFun()">Link will open in the new window</a>
   <script>
      function blankFun() {
         window.open('https://www.tutorialspoint.com/', '_blank');
      }
   </script>
   </body> 
</html>

Example

Let us see another example of simulate a target="_blank" in JavaScript. Here, we are going to use the input and button types, and window.open method.

<html> 
   <body> 
      <h2>Simulate target="_blank" for various types of buttons using JavaScript </h2>
      <input type="button" onclick="windowTab('https://www.tutorialspoint.com/')" value="submit">
      <br><br>
      <button type="button" onclick="newWindow('https://www.tutorix.com/')">click here</button>

      <script>
         function windowTab(url) {
            window.open(url, '_blank');
         }
            function newWindow(url) {
            window.open(url, '_blank');
         }
      </script>
   </body> 
</html>

Conclusion

In this article, we have successfully explained how to simulate a target=“_blank” using the JavaScript along with the examples. We have used the two different examples, in the first example, we used the onlick event, and window.open method for the anchor tag. For the second example, we have used the onclick, window.open method for the button types like input and button.

Updated on: 24-Feb-2023

5K+ Views

Kickstart Your Career

Get certified by completing the course

Get Started
Advertisements