Maison >interface Web >js tutoriel >Comment fermer l'onglet actuel dans une fenêtre de navigateur en utilisant JavaScript ?

Comment fermer l'onglet actuel dans une fenêtre de navigateur en utilisant JavaScript ?

WBOYavant: 2023-09-15 21:21:07692parcourir

如何使用 JavaScript 关闭浏览器窗口中的当前选项卡？

Dans ce tutoriel, nous apprendrons à fermer la fenêtre du navigateur à l'aide de JavaScript. Supposons qu'un utilisateur ouvre votre site Web dans 2 onglets et ne souhaite pas l'autoriser, vous pouvez alors utiliser JavaScript pour fermer automatiquement un onglet.

De plus, si vous remarquez que certaines applications Web ouvrent automatiquement une fenêtre de navigateur pour capturer un visage, elle se fermera automatiquement lorsque vous capturerez l'image en cliquant sur le bouton. C'est tout ce que nous pouvons faire avec JavaScript.

Ce tutoriel enseignera différents exemples de fermeture de l'onglet actuel dans une fenêtre de navigateur à l'aide de JavaScript.

REMARQUE - JavaScript ne permet jamais aux développeurs de fermer les fenêtres ouvertes par l'utilisateur. Cela est dû à certains problèmes de sécurité. Par conséquent, les programmeurs ne peuvent fermer la fenêtre du navigateur ouverte qu'à l'aide de la méthode open() de JavaScript.

Grammaire

Vous pouvez utiliser la méthode close() selon la syntaxe suivante pour fermer la fenêtre du navigateur.

let new_window = window.open(URL, width, height);
new_window.close();

Dans la syntaxe ci-dessus, nous stockons la valeur de retour dans la variable new_window lors de sa création. Après cela, nous fermons la fenêtre nouvellement ouverte en utilisant la méthode close().

Exemple

Dans cet exemple, nous avons deux boutons : l'un ouvre un nouvel onglet et l'autre ferme le nouvel onglet ouvert à l'aide de JavaScript.

Les utilisateurs doivent d'abord ouvrir l'onglet à l'aide de JavaScript en cliquant sur le bouton « Ouvrir un nouvel onglet ». Ils peuvent cliquer sur le bouton « Fermer le nouvel onglet » et le regarder fermer automatiquement l'onglet.

<html>
<body>
   <h2>Using the <i>window.close()</i> method to close the browser's tab</h2>
   <p>Click "Open New Tab" to open a page in new tab and click "Close New Tab" to colse the opened tab</p>
   <button id = "openTab" onclick = "openTab()">Open New Tab </button><br><br>
   <button id = "closeTab" onclick = "closeTab()">Close New Tab</button>
   <script>
      // creating the variable to store the tab
      var new_tab;
      function openTab() {
         // open a new tab
         new_tab = window.open("https://www.tutorialspoint.com/answers/shubham-vora");
      }
      function closeTab() {
         // close tab
         new_tab.close();
      }
   </script>
</body>
</html>

Exemple

Dans l'exemple ci-dessous, nous avons créé deux boutons comme l'exemple ci-dessus pour ouvrir et fermer les onglets. Cependant, dans cet exemple, nous avons également ajouté "_blank" comme paramètre à la méthode open, qui ouvrira une nouvelle fenêtre au lieu d'un nouvel onglet.

Ensuite, les utilisateurs peuvent cliquer sur le bouton Nouvelle fenêtre pour fermer la fenêtre contextuelle.

<html>
<body>
   <h2>Using the <i>window.close() method</i> to close the browser's window.</h2>
   <p>Click "Open New Window" to open the page in new window and click "Close New Window" to colse the opened window</p>
   <button id = "openWidnow" onclick = "openWindow()"> open new Window</button><br><br>
   <button id = "closeWidnow" onclick = "closeWindow()">Close new Window</button>
   <script>
      // creating the variable to store window
      var new_window;
      function openWindow() {
         // open a new window
         new_window = window.open("https://www.tutorialspoint.com/index.htm", "_blank", "width=800");
      }
      function closeWindow() {
         // close the window
         new_window.close();
      }
   </script>
</body>
</html>

Ainsi, les utilisateurs apprennent à utiliser JavaScript pour ouvrir de nouveaux onglets ou fenêtres. De plus, vous avez appris à utiliser la méthode close() pour fermer un onglet ou une fenêtre.

De plus, nous pouvons également ouvrir une nouvelle fenêtre pour accepter la saisie de l'utilisateur. Lorsque l'utilisateur soumet les données du formulaire, nous pouvons appeler la méthode close() dans la fonction qui traite les données du formulaire.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

JavaScript

Déclaration：

Cet article est reproduit dans:. en cas de violation, veuillez contacter admin@php.cn Supprimer

Article précédent：FabricJS - Comment redimensionner un objet image à une largeur donnée ?Article suivant：FabricJS - Comment redimensionner un objet image à une largeur donnée ?

Articles Liés

Voir plus