これらの私のコード私は書かれたユーザーがモーダルの外側のどこかをクリックすると閉じますが、それは動作していません。何かが私のコードで間違っています

Question

私のために書かれたこれらのコードは、それを閉じても動作していません。私のコードでは間違っています。 "box-search"、 "login"、 "register"要素のID名。

​​

Answer 1

あなたはループを反復するたびに、あなたはwindow.onclickのための最後の値を一掃し、その値として、新たな機能を設定しています。イベントハンドラを登録するには.addEventListener()を使用してください。

iが高いレベルで宣言されているため、コールバック関数でiが使用されているため、その周りにクロージャが作成されているという問題がありました。閉鎖の詳細はhereです。ループが終了したときに最後の値がiに設定されているため、クロージャによってイベント処理関数はすべてmodal[3]を探していました。

閉鎖を回避し、window.onclickの上書きを修正するために、スクリプトは次のようになります。[ループ内のJavaScriptの閉鎖 - シンプルな実用的な例]の

<script> 
    // Use modern standards to set up event handlers: 
    window.addEventListener("click", testModal) 

    function testModal(event){ 
    var modal = ["box-search","login","register"]; 

    // Use the built-in Array.prototype.forEach method to loop 
    // through the array elements, thus avoiding a numeric counter 
    modal.forEach(function(element){ 
     // Search the DOM for elements that have id'sthat 
     // match the modal array's id's 
     var el = document.getElementById(element); 

     // Check the found element 
     if (event.target == el) { 
      el.style.display = "none"; 
     } 
    }); 

    }  
</script> 

Answer 2

あなたwindow.onClickが間違っている：機能外あなたのモーダルの

の1-あなたループ、あなたはそれを動作させるために内部に行う必要があります正しく

2 - あなたとevent.target比較モーダル配列要素ではなく、それはidが

、3-だあなたは（モーダル[i]）としていない、あなたのevent.targetオブジェクトに文字列にスタイルを割り当てよう

これは再です書かれた関数（それが動作するはずです）

window.onclick = function(event) { 

for(var i=0;i<3;i++) { 
    if (event.target.id == modal[i]) { 
    event.target.style.display="none"; 
    } 
} 
}