フロントエンド テクノロジーの継続的な開発により、Web サイトはますますインタラクティブになり、さまざまな効果を実現するために JavaScript を使用する必要がある Web サイトがますます増えています。その中でも最も一般的なのがクリックイベントで、Webサイトによってはクリック後に閉じるために再度クリックする必要があるケースが増えています。そこで問題は、JavaScript クリックによる 2 番目の閉じる効果をどのように実現するかということです。

1. 基本的な考え方

JavaScript クリックの 2 番目のクローズ効果を達成することは難しくありません。基本的な考え方は次のとおりです:

1. クリック イベントを監視し、各クリックを合計します。クリック数;

2. クリック数が指定された数に達したら、クローズ操作を実行します。

2. 実装

例を通してこの関数を実装してみましょう。

#HTML 部分
1. #

   
   
     
   JavaScript点击第二次关闭
   
     
   这是一个演示点击第二次关闭的效果的实例。
   
     关闭
   
     
   
   

   ログイン後にコピー

2. var closeBtn = document.getElementById("closeBtn");
   var clickCount = 0;
   
   closeBtn.onclick = function() {
     clickCount++;
     
     if (clickCount == 2) {
       window.close();
     }
   };

   ログイン後にコピー
#CSS 部分 (オプション)

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;
}

3. 効果を実現するには
3. ボタンを 1 回クリックしてもウィンドウは閉じません;

ボタンを 2 回クリックすると、ウィンドウは自動的に閉じます。

4. 注意事項

1. クリック イベントにはボタン、ハイパーリンクなどを指定できます;

2. クリック数は任意の数として指定できます;

3. 閉じる操作には、Web ページを閉じる、ボタンを非表示にするなど、任意の操作を指定できます。

つまり、実際のニーズと基本的なアイデアの柔軟な使用に応じて、JavaScript を 2 回閉じる効果を実現できます。

以上がJavaScript を使用して 2 回目のクリックで閉じる効果を実現する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。