隐藏元素

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

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

我认为避免绑定多个点击事件的更好方法是侦听在点击内部点击的锚点。

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

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

Answer 2

您必须将自己的事件侦听器添加到链接中并在其中调用event.stopPropagation()。