Question

我创建了自己的工具提示，在屏幕中间div.over-bg有1个全屏div.over-box和1个小div：

<div class="over-bg" id="over-hat">
    <div class="over-box">        
        <a href="">link</a>
    </div>
</div>

和JS一起展示和隐藏：

    $('.over-bg').click(function(){
       $('.over-bg').fadeOut();//hidding when we click outside .over-box
    });

    $('#over-hat .over-box').click(function(){
        return false;// do nothing when we click into .over-box
    });

一切都很完美，但当我在div.over-box内有链接时，它不起作用。我想制作，只有当我们点击外面时，工具提示才会关闭。但链接必须工作。有什么想法吗？

Answer 1

将您的第二个代码段更改为以下内容：

$('#over-hat .over-box').click(function(e){
   return($(e.target).prop("tagName")=="A");
});

这将有助于a标记采用默认操作，其他人则忽略该事件。

Answer 2

尝试添加此JQuery语句以及您已有的语句：

$('#over-hat .over-box a').click(function(){
    window.location = $(this).attr('href');
});

Answer 3

我只是假设在这里，但是当你点击链接时，听起来你想要.over-bg fadeOut。如果是这样，你将不得不为锚点本身设置另一个点击处理程序，因为我认为锚点的默认行为是不要将它们的事件冒泡。

看看这个小提琴http://jsfiddle.net/TCegn/

我自己的工具提示中的一个href

3 个答案: