如何解决即使离开了div,也会触发JQuery悬停mouseenter事件
| 我有2个div,定义如下:<div id=\"feedsInfo\"></div>
<div id=\"feeds\">
<ul>
<li><p id=\"a\">A</p></li>
<li><p id=\"b\">B</p></li>
<li><p id=\"c\">C</p></li>
</ul>
</div>
我添加如下悬停事件:
$(\"#feeds p\").filter(function(){
return ($(this).attr(\'id\') == \'a\' ||
$(this).attr(\'id\') == \'b\' ||
$(this).attr(\'id\') == \'c\'
)})
.hover(function(e){
$(this).css(\'background-color\',\'red\');
$(\'#feedsInfo\').css(\'background-color\',\'red\');
<< dynamically append <a href> tags to div id=\'feedsInfo\' >>
},function(e){
$(\"#feedsInfo\").children().remove();
$(this).css(\'background-color\',\'blue\');
$(\'#feedsInfo\').css(\'background-color\',\'blue\');
}):
问题是,如果我只是在列表\'A \'\'B \'\'C \'上移动,我仍然可以在div id = \'feedsInfo \'中看到链接标记(鼠标现在位于其他位置。简而言之,它应该触发mouseleave事件),即使它们在mouseenter或mouseleave事件中从红色更改为蓝色,从蓝色更改为红色。
请说明当我只浏览列表并且鼠标没有悬停在列表\'A \'\'B \'\'C \'上时如何从div中删除链接标签
解决方法
尝试这个:
$(\"#feedsInfo\").html(\'\');
, 了解您正在使用哪个浏览器/版本以及哪个版本的jQuery会很有帮助。
试试$(\"#feedsInfo\").empty();
。
如果这不起作用,则可能是您遇到的浏览器怪癖。作为一种解决方法,您可以尝试在p
标记的父容器上放置一个hover
事件处理程序,这将清空#feedsInfo
块。鼠标离开p
节点后,通常会进入其父节点,因此在您的情况下效果很好。
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。