javascript - 特定のdivの外側をクリックすると関数を呼び出す

Question

私はhtml構造を持っています

<div class="abc">
  <div id="test">
    <label>Name</label>
    <input type="checkbox">
    <label>Name</label>
    <input type="checkbox">
    <label>Name</label>
    <input type="checkbox">     
  </div>
</div>

div id testの外側をクリックすると、特定の関数を呼び出すことができます。また、 div id テスト内でイベントがトリガーされることはありません。つまり、チェックボックスをクリックしても、イベントはトリガーされません。

どんな助けでも本当に感謝します。

score 11 · Accepted Answer

次のコードで実現できます（デモ：http://jsfiddle.net/CrfCD/）

$(document).ready(function(){
    $(document).click(function(e){
        if ($(e.target).is('#test,#test *')) {
            return;
        }
        else
        {
            alert("Hi");
            //Perform your event operations
        }
    });
});

score 2 · Accepted Answer

これを試して、

 $('.abc').click(function(e){
  if(e.target.id == 'test') {
   return false;
  }
 })

score 2 · Accepted Answer

使用するだけです：（デモ）

JavaScript

$('.abc').click(function(e){
    alert('Do anything');
});

$('#test').click(function(e){
    e.stopPropagation();
    // Do only if anything in #test was clicked
});

e.stopPropagation()イベントが次の要素にバブリングするのを防ぎます

score 1 · Accepted Answer

$(document).click(function(e){
   if(e.target.id == "test"){
     e.preventDefault();      
     e.stopPropagation();   
   }
   else{
      //your function call that you want to invoke on clicking anywhere outside of div _test_
   } 
});

score 1 · Accepted Answer

$(document).click(function(e) {
   if(e.target.id == 'test') {
        alert( "Handler for .click() called." );
    }

});

JSFIDDLE デモ

score 1 · Accepted Answer

クリックした div の ID を取得し、test と等しいかどうかを確認できます。

$("body").on("click", function(e) {
    if(e.target.id != "test") {
       // do something
       return false;
    }
    else {
       return false;
    }
});

score 1 · Accepted Answer

Div フォーカスイベントを使用して、div がフォーカスを失ったときに一度だけ呼び出されるようにします。投稿のDiv - onblur 関数を参照してください

score 1 · Accepted Answer

HTML:

<div id="abc" onclick="getId()">

JavaScript:

function getId() {
    --Write your function here--
}

score 1 · Accepted Answer

これを試して

$(document).click(function(e) {
   if($(e.target).is("#test")){
     e.preventdefault();
     e.stopPropogation();
   } else{ 
     //call your method
   }
}

javascript - 特定のdivの外側をクリックすると関数を呼び出す

9 に答える 9

Related

Reference