Question

当鼠标进入图像时，我有一个标记出现在图像上。当我想用鼠标链接时，链接在逻辑上消失了，因为我使用.mouseleave()函数在鼠标离开图像时隐藏链接。

我想对.mouseleave()做一个条件测试，如下所示：

if(!$("#linkId").mouseenter()){
//...
}

我尝试使用. not（）。mousenter（）而不是!而不是

但它不起作用..当我进入链接时，它会停留并且永远不会离开...

谢谢

萨姆

Answer 1

将链接和图像放在容器中，并将事件处理程序分配给容器。您可以使用CSS定位链接。

由于链接和图片是父级的子级，因此当您将鼠标悬停在链接上时，不会触发mouseleave事件。

示例：

HTML：

<div id="parent">
    <div id="image"></div> <!-- the div is just an example -->
    <a id="link" href="#">Some link</a>
</div>

CSS：

#parent {
    position: relative;
}

/* used div for demo only */
#image {
    width: 100px;
    height: 100px;
    border: 1px solid black;
}

#link {
    position: absolute;
    top: 0;
    left: 0;
    display: none;
}

JavaScript的：

$('#parent').hover(function() {
    $('#link').toggle();
});

DEMO

$("#linkId").mouseenter()没有按照您的想法行事。它不会测试鼠标是否在链接之上，它会在链接上生成mouseenter事件。

Answer 2

使用hover()，将其绑定到链接和图像，或者将图像放在链接元素中。

即

<img src="example.gif" alt="" id="showme" style="display:none" />
<a href="#" id="hoverme">Hover me</a>

<script type="text/javascript">
    $('#hoverme,#showme').hover(function(){
        $('#showme').toggle();
    });
</script>

如何使用jquery进行if条件测试？

2 个答案: