Question

如果点击div（panel1）中的任何元素，我怎么能告诉你使用jQuery？我有这段代码用于显示/隐藏弹出窗口：

$('body').click(function (e) {
        if ($(e.target).attr('id') == 'link1') {
            $('#panel1').show();
        } else {
            $('#panel1').hide();
        }
    });

问题是如果单击panel1中的任何控件/元素，弹出窗口（panel1）将被解除。我想保持panel1处于打开状态，除非单击panel1之外的区域（或者再次单击link1）。如何修改此代码才能实现此目的？感谢...

Answer 1

试试这个

$('#panel1').click(function (e) {
       e.stopPropagation();
       //Other code if you want to execute anything on panel click.
    });

$('body').click(function (e) {
       if($("#panel1").is(":visible")) 
          $('#panel1').hide();
    });

Answer 2

制作以下html标记：

<body>
<div id="div1">
... all the body content here
</div>
<div id="panel1">
</div>

我认为弹出窗口＃panel1无论如何都处于正常流量之外，所以没问题。然后在jquery中使用div1而不是body，就是这样： - ）

Answer 3

$('body').click(function (e) {
        if ($(e.target).attr('id') == 'link1') {
            $('#panel1').show();
        } else if($(e.target).attr('id') != 'panel1') {
           $('#panel1').hide();
        }
    });

使用jquery确定是否单击了div中的任何元素

3 个答案: