工具提示悬停 select 和选项在 IE 中不起作用

Question

我不确定在这里问这个问题是否合适，但我在使用工具提示器和 IE 时遇到了问题。当我制作一个在悬停时显示的交互式工具提示器并在其中添加一个带有 select 框的表单时，在 IE 中也不可能 select 一个选项，因为工具提示器关闭并且您无法制作 select离子。

我做了一个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 选项，形式为 select 选项（显示：block/inline-block 等）并使用 Z-index。但是没有任何效果，当我 'open' select 选项时，工具提示一直关闭。

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

Answer 1

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

问题不仅在于工具提示，还在于 IE 如何实现 select 框。您可以通过添加 event.stopPropagation 和 select.

来修复它

默认修复：

$(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();
        });
    });
}

工具提示悬停 select 和选项在 IE 中不起作用

Tooltipster hover select and option not working in IE

javascript

internet-explorer

select

hover

tooltipster

默认修复：

工具提示修复：