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

Question

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

<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

I'm just assuming here, but it sounds like you want .over-bg to fadeOut when you click the link. If so, you'll have to set up another click handler for the anchor itself, because I think the default behavior for anchors is to not bubble their event up.

Take a look at this fiddle http://jsfiddle.net/TCegn/

Answer 3

除了您已有的内容之外，尝试添加此 JQuery 语句：

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