Question

我有一个jquery函数，当点击文档的任何位置时隐藏div：

    $(document).click(function() {
    if($('#child_link').css("display") == "block"){
       $('#child_link').css("display","none");
      }
    });

我想为一个div'#child_link'添加一个例外。我该怎么做？

我试过了：

    $(document).not('#child_link').click(function() {
    if($('#child_link').css("display") == "block"){
       $('#child_link').css("display","none");
      }
    });

但它为整个文档添加了一个例外。

Answer 1

检查目标是否不是child_link

$(document).click(function (e) {
    if ($('#child_link').css("display") == "block" && e.target.id != "child_link") {
        //                                            ^^^^^^^^^^^^^^^^^^^^^^^^^^
        $('#child_link').css("display", "none");
    }
});

另请注意，您可以使用.hide（）//。is（'：visible'）

$(document).click(function (e) {
    if ($('#child_link').is(":visible") && e.target.id != "child_link") {
        $('#child_link').hide()
    }
});

Answer 2

尝试这样的事情

$(document).click(function(e) {
    if( e.target.id != 'child_link'){
        if($('#child_link').css("display") == "block"){
            $('#child_link').css("display","none");
        }
    }
});

Answer 3

尝试$('*').not('#child_link')而不是$(document).not('#child_link')

Answer 4

点击检查div-id，如果不是“child_link”，则写入if。

$(document).click(function(e) {
    if( e.target.id != 'child_link'){
        if($('#child_link').css("display") == "block"){
            $('#child_link').css("display","none");
        }
    }
});

Answer 5

使用delegated event handler

$(document).on("click", "*:not('#child_link')", function(){
    $('#child_link').toggle();
});

除儿童链接外，它将触发所有内容 .toggle()将在隐藏和显示元素之间切换

Answer 6

请尝试以下方法：

http://jsfiddle.net/GjTgf/1/

$('#child_link').click(function(e) { 
  e.stopPropagation();
 })

 $(function(){
  $(document).click(function(){  
  $('#child_link').hide(); 
  });
});

希望这有助于解决您的问题。

.click（）函数用于处理整个文档，但不能与一个div一起使用

6 个答案: