jquery:嵌套标签和hover()在IE中不起作用
我有这样的结构:
我需要捕获容器的mouseout事件,所以我做了jquery这样做:
$("#container").hover('',function(){ alert("Out"); });
在Firefox / Opera中,它只在离开div时触发mouseout-function(我多么想要它)。
在IE中,它会在鼠标命中的div内的每个* -Tag处触发mouseout-function。 (*可能很重要的是,span标签还有mouseover和out事件)
任何人都知道如何解决这个问题? (由于复杂的布局,嵌套结构无法更改)
thx4任何想法!
@evelio:它没有用,id总是“容器”
我是怎么解决的(到目前为止……):
信不信由你,容器div的属性background-color必须用颜色设置。 我仍然对这个事实感到非常震惊,但我尝试了几次,它只有css中的背景颜色属性使它工作与否。
并且:颜色#000000不起作用,任何其他颜色都可以,包括“白色”
$("#container").hover('',function(ev){ alert("Out"); if( ev.stopPropagation ) { ev.stopPropagation(); } //For 'Good' browsers else { ev.cancelBubble = true; } //For IE });
还读到: 事件冒泡和捕获
试试这个
$("#container").mouseleave(function(){ alert("Out"); });
至于IE,抵制蹩脚的浏览器并制作关于其纯粹无望的博客,直到你的手指麻木。 该浏览器负责网页设计师的时间比应有的少33%。 你可以用任何方式杀死它。
你可以解决它的方法是添加1px transparant png作为背景。
请参阅: IE8:Div hover仅在设置背景颜色时有效,非常奇怪,为什么?
Mhhh我没有IE附近,但你可以尝试jQuery mouseout演示 (和hover演示),如果它工作正常似乎是你的代码在其他一些行的麻烦…最后你可以使用它来工作:
$("#container").hover('',function() { //Are you sure? if($(this).attr('id') == 'container') { alert('yup this is container'); } });
你有没有尝试过:
$("#container").hover('',function(){ alert("Out"); return false; });
要么:
$("#container").hover('',function(e){ if($(e.target).is("#container")){ alert("Out"); return false; } });
或者更好的是:
$("#container").mouseout(function(e){ if($(e.target).is("#container")){ alert("Out"); return false; } });
如果您只需要mouseout,则没有理由使用hoverfunction。
我在IE 6,7和8中遇到了类似的问题.Mafka是对的,必须设置背景颜色才能使其正常工作。 如果在“容器”上设置背景颜色不可行,您仍然可以将背景颜色设置为白色并将不透明度设置为0。
在jQuery中绑定mouseover事件之前,我使用以下JavaScript代码完成了此操作:
if ($.browser.msie) { $("#container").css({ background: '#fff', opacity: 0 }); }