隐藏元素

Question

参考my previous question 我遇到了另一个问题。我显示的 div 包含其中的链接。当我点击它们时，div 会按预期消失，但不是按预期消失..（我们希望它在我们点击页面上的任何位置时消失......但其中的链接）

当前使用的代码：

   $.listen('click', '.tabImg', function(event) {
                var el = $('#tabs_menu');
                var dv = $('.tabImg').parent();

                var pos = dv.offset();


                $(el).show();
                $(el).css( {"position": "absolute", "left": (pos.left) + "px", "top":20 + pos.top + "px" } );

                $(document).one('click', function()
                { 
                    $(el).slideUp().hide()
                });
                event.stopPropagation();
    });

tabs_menu 是我显示的 div，其中包含链接...

解决方法是什么？

Answer 1

您需要将链接绑定到点击事件并停止冒泡，这样文档就不会收到冒泡的点击。

我认为避免绑定多个点击事件的更好方法是在文档点击中监听被点击的锚点。

所以基本上如果触发点击事件的元素是锚点就不要向上滑动

$(document).one('click', function(ev) { 
    if ( !$(ev.target).is('a') ){
        $(el).slideUp().hide()
    }
});

Answer 2

你必须在链接中添加自己的事件监听器并在里面调用event.stopPropagation()。