IE8，jQuery UI工具提示在Internet 8中立即关闭
安装程序
我们有一个jQuery UI工具提示，它通过附加到表单元素内的<div class="fieldset"> (.fieldset)元素的mouseenter事件来显示。当鼠标离开div时，工具提示应该会消失。
问题
在IE8中，只有IE8，当您在.fieldset元素的区域上悬停时，工具提示立即消失。IE8的行为就好像子元素实际上不是父元素的后缀，或者工具提示使用的是mouseover和mouseout事件。但是，对于这个工具提示，我们使用的是mouseenter和mouseleave事件。
我已经尝试给.fieldset元素一个坚实的背景。我也尝试了一个透明的图像。我检查了子元素的z-index以确保没有不同。我所做的一切似乎都没有用。
当鼠标悬停在.fieldset元素及其任何子元素上时，我需要工具提示保持显示。
码
HTML：
<form class="form centerBH" id="form" style="display: block; zoom: 1;">
<div class="fieldset">
<h2 class="legend">Autogenerated Image Links</h2>
<div id="image" class="panebox" >
<div class="ui-widget">
<ul>
</ul>
</div>
</div>
</div>
</form>CSS：
.form {
width: 50em;
/* correct margin collapse in IE */
overflow: auto;
}
/* ensure all form elements will fade in and out */
form * {
filter: inherit;
}
.panebox {
background-color: #F7F7F7;
border-color: #B7B9BD;
border-radius: 10px;
border-style: solid;
border-width: 1px;
box-shadow: 0px 1px 0px 0px rgba(255,255,255,.7), 0px 1px 2px 0px rgba(0,0,0,.1);
margin: 7px;
padding: 14px;
position: relative;
overflow: hidden;
}JavaScript：
同样，我使用的是jQuery UI工具提示，它自动绑定到任何定义了标题属性的元素。但是，我已经尝试显式地将mouseenter和mouseleave事件附加到.fieldset div，以显示和隐藏工具提示，但我仍然得到相同的行为。
下面是我如何设置工具提示：
this.fieldsetTooltip=this.$(".fieldset").tooltip({
content: 'Click an image link to open that image.',
disabled: true,
items: ".fieldset",
position: {
my:"left+20 top+25",
at:"right top",
collision: "none",
using: function( position, feedback ) {
//console.log(feedback.target.width);
$( this ).css( position );
$( "<div>" )
.addClass( "arrow" )
.addClass( feedback.vertical )
.addClass( feedback.horizontal )
.appendTo( this );
}
}
}); 下面是我如何手动打开和关闭工具提示：
this.$el.on("mouseenter",'.fieldset',function(e){
console.log("Mouse entering .fieldset");
_this.fieldsetTooltip.tooltip("open");
});
this.$el.on("mouseleave",'.fieldset',function(e){
console.log("Mouse leaving .fieldset");
_this.fieldsetTooltip.tooltip("close");
});当窗口对象触发它的调整大小事件时，我们也会触发一个自定义的调整大小事件。
// close tooltip when user resizes the window
this.listenTo(AppReg.events,"context:resized",function() {
_this.fieldsetTooltip.tooltip("close");
}); 基于来自上述事件的控制台日志的更新，mouseenter和mouseleave事件将按应有的方式触发。但是，我认为jQuery UI工具提示将一个不同的事件绑定到元素(可能是'mouseout'?)，这会导致它自动关闭。
有人知道怎么阻止这事吗？
回答 2
Stack Overflow用户
发布于 2013-11-06 16:33:34
问题的罪魁祸首是IE8处理调整大小事件的方式。我使用$(window).resize()在窗口对象上附加了一个调整大小的事件处理程序。由于某种原因，每当显示工具提示时，IE8都会触发resize事件。
我使用了本文中的解决方案：window.resize event firing in Internet Explorer
基本上，在触发事件之前，您必须检查以确保窗口的尺寸确实发生了变化。
Stack Overflow用户
发布于 2017-08-24 16:35:45
我在Nokia 520 11 (IE 11)上有一个类似的问题。我添加了用于显示工具提示的附加代码：
$(".has_tooltip").tooltip();
if (/Lumia/.test(navigator.userAgent) && getInternetExplorerVersion() == 11)
{
$(".has_tooltip").click(function(){
$(this).tooltip("open");
})
}所以，在我的例子中，$(this).tooltip("open");做到了这一点。
*在我的移动应用程序中，当元素被点击时，工具提示就会出现。
https://stackoverflow.com/questions/19599571
复制相似问题
腾讯云开发者
