Maison > Article > interface Web > Comment utiliser JavaScript pour obtenir l'effet de fermeture au deuxième clic

Comment utiliser JavaScript pour obtenir l'effet de fermeture au deuxième clic

PHPzoriginal: 2023-04-26 14:24:54763parcourir

Avec le développement continu de la technologie front-end, les sites Web deviennent de plus en plus interactifs et de plus en plus de sites Web doivent utiliser JavaScript pour obtenir divers effets. Parmi eux, les événements de clic sont les plus courants, et sur certains sites Web, il existe de plus en plus de cas où vous devez cliquer à nouveau pour fermer après avoir cliqué. La question est donc de savoir comment obtenir l'effet de fermeture de JavaScript au deuxième clic ?

1. Idée de base

Il n'est pas difficile d'obtenir l'effet d'un clic JavaScript pour fermer une deuxième fois :

#🎜 🎜#1. Écoutez les événements de clic, chaque clic accumule le nombre de clics ;

2 Lorsque le nombre de clics atteint le nombre spécifié, effectuez l'opération de fermeture.

2. Implémentation

Implémentons cette fonction à travers un exemple.

<body>

  <h1>JavaScript点击第二次关闭</h1>

  <p>这是一个演示点击第二次关闭的效果的实例。</p>

  <button id="closeBtn">关闭</button>

  <script src="main.js"></script>

</body>

var closeBtn = document.getElementById("closeBtn");
var clickCount = 0;

closeBtn.onclick = function() {
  clickCount++;
  
  if (clickCount == 2) {
    window.close();
  }
};

#🎜 🎜# Partie CSS (facultatif)

button {
  background-color: #4CAF50;
  border: none;
  color: white;
  padding: 15px 32px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 16px;
  margin: 10px;
  cursor: pointer;
}

Lorsque le bouton est cliqué une fois, la fenêtre ne sera pas fermée

#🎜 ; 🎜# Lorsque vous cliquez deux fois sur le bouton, la fenêtre se ferme automatiquement.

4. Notes

1 L'événement de clic peut être un bouton, un lien hypertexte, etc.

2. spécifié comme nombre arbitraire ;

3. L'opération de fermeture peut être n'importe quelle opération, telle que fermer la page Web, masquer le bouton, etc.

En bref, selon les besoins réels et l'utilisation flexible des idées de base, l'effet de fermeture de JavaScript pour la deuxième fois peut être obtenu.

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!

Déclaration：

Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn

Article précédent：Qu'est-ce que l'API JavaScriptArticle suivant：Qu'est-ce que l'API JavaScript

Articles Liés

Voir plus