如何在JavaScript中模擬target="_blank"？

onclick事件僅在使用者點選元素時發生，它是一個純JavaScript屬性。每當你點選onclick事件時，它都會執行一些操作，例如顯示訊息或將使用者重定向到另一個頁面。 在網站中應儘量減少onclick事件的使用，因為它可能會讓使用者感到困惑。因此，請謹慎使用此事件。

window.open()方法用於在新視窗或瀏覽器標籤頁中開啟連結或網頁。它受所有著名的瀏覽器支援，例如Chrome、Firefox和Opera。window.open()是JavaScript的預定義方法。它完全取決於瀏覽器的設定和分配給引數的值。

在本文中，我們將學習如何在JavaScript中模擬target=”_blank”。

語法

以下是window.open()方法的語法：

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

引數

  • URL − 指定需要在新標籤頁中開啟的頁面的URL。如果未定義URL，則會開啟一個空白的新標籤頁。

  • name − 用於設定視窗名稱。

  • specs − 用於分隔專案，用逗號分隔，不留空格。

  • replace − 它建立一個新條目或替換當前列表。

以上所有引數都是可選的。

步驟

按照以下步驟在JavaScript中模擬點選：

步驟1 − 在body部分，我們定義了標題、錨點和指令碼元素。

步驟2 − 對於錨點元素，定義了blankFun()方法。使用此方法，當我們點選連結時，連結將在新標籤頁中開啟。

步驟3 − 使用window.open方法設定連結在新視窗標籤頁中開啟。

步驟4 − 點選連結後，將觸發onClick事件函式，它將在新視窗標籤頁中開啟連結。

示例

在這個例子中，我們將看到每當我們點選按鈕時如何計算點選次數。

<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://tutorialspoint.tw/', '_blank');
      }
   </script>
   </body> 
</html>

示例

讓我們看看另一個在JavaScript中模擬target="_blank"的示例。這裡，我們將使用輸入和按鈕型別以及window.open方法。

<html> 
   <body> 
      <h2>Simulate target="_blank" for various types of buttons using JavaScript </h2>
      <input type="button" onclick="windowTab('https://tutorialspoint.tw/')" 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>

結論

在本文中，我們成功地解釋瞭如何使用JavaScript以及示例來模擬target="_blank"。我們使用了兩個不同的示例，在第一個示例中，我們對錨標籤使用了onclick事件和window.open方法。在第二個示例中，我們對像input和button這樣的按鈕型別使用了onclick和window.open方法。

更新於：2023年2月24日

6000+ 瀏覽量

啟動您的職業生涯

透過完成課程獲得認證

開始學習
廣告