0

我不确定这是否是问这个问题的正确地方，但我在使用 tooltipster 和 IE 时遇到了问题。当我制作一个在悬停时显示的交互式工具提示器并添加一个带有选择框的表单时，不可能在 IE 中选择一个选项，因为工具提示器关闭并且您无法进行选择。

我做了一个 Plunker 来快速显示问题（在 IE 中打开）： http ://plnkr.co/lckgcT

<div id="corres_button" role="button">
  Hover me for the tooltipster!
</div>

$(document).ready(function() {
  $('#corres_button').tooltipster({
    interactive: 'true',
    contentAsHTML:'true',
    trigger: 'hover',
    arrow: false,
    position: 'bottom',
    content: $('<div><span><strong>Try selecting an option in IE the tooltipster will close since it loses its hover</strong></span><form><label>Testing</label><select><option value="1">Test</option><option value="2">Test 2</option><option value="3">Test 3</option><option value="4">Test 4</option></select></form></div>')
  });
});

我尝试在表单选择选项（显示：块/内联块等）中添加各种 css 选项并使用 Z-index。但是没有任何效果，当我“打开”选择选项时，工具提示器会不断关闭。

我很抱歉英语不好，我希望问题很清楚！

4

1 回答 1

1

修复它并使用修复更新 Plunker。

问题不仅在于工具提示器，还在于 IE 如何实现选择框。您可以通过添加选择来修复它event.stopPropagation。

默认修复：

$(document).ready(function(){
  $("select").mouseleave(function(event){
    event.stopPropagation();
  });
});

通过在您的工具提示器中修复此问题，您还需要在工具提示器的 functionReady 中添加以下内容

工具提示修复：

functionReady: function(origin) {
    origin.tooltipster('content').find('select').each(function() {
        jQuery(this).mouseleave(function(event){
            event.stopPropagation();
        });
    });
}
于 2015-01-08T11:30:05.060 回答