在 Internet Explorer 上悬停表格标题时不显示工具提示答案

【问题标题】：Tooltip does not appear when hover table header on Internet Explorer在 Internet Explorer 上悬停表格标题时不显示工具提示
【发布时间】：2019-06-06 08:23:05
【问题描述】：

仅在 Internet Explorer 上悬停表格标题时不会出现工具提示。

你好。我在 IE 上的网格有问题。我使用 jQuery 选择器构建了一个带有内部文本的工具提示，它从目标中复制文本。仅当元素具有“省略号”属性并且此文本未完全显示在行上。

部分 jQuery 选择器：

  var target = e.target,
                tooltip = e.sender,
                tooltipText = "";

            if (target[0].offsetWidth < target[0].scrollWidth) {
                tooltipText = target[0].value || target[0].innerText;
            }

            tooltip.popup.unbind("open");
            tooltip.popup.bind("open", function (arg) {
                tooltip.refreshTooltip = false;
                if (target[0].offsetWidth > target[0].scrollWidth || tooltipText === "") {
                    arg.preventDefault();
                } else if (tooltipText !== target[0].value && tooltipText !== target[0].innerText) {
                    tooltip.refreshTooltip = true;
                }
            });

            return tooltipText;

它在 Chrome 上工作，而我悬停表格标题但在 IE 上它只适用于 td 元素，它不适用于表格的第 th 元素。我尝试将 white-space:nowrap; 添加到第 th 元素和 table-layout:fixed; 为表格本身，但它没有用。

【问题讨论】：

您说，'此文本未完全显示在行上。'这是否意味着，它出现但没有显示完整的字符串？如果可能，请尝试发布问题的屏幕截图和预期的输出。它可以帮助我们更好地理解问题。还要检查您是否在控制台中收到错误消息。通知我们。

标签： javascript jquery html user-interface internet-explorer

【解决方案1】：

问题与 IE 和 Edge 浏览器（Chromium 引擎之前的版本）有关。他们读到元素的宽度与其他浏览器不同，并且浏览器认为显示整个文本，即使文本是省略号（只有在这种情况下才应该显示工具提示）。这个问题非常棘手，因为在 hoover 表格的标题中没有出现工具提示。为了解决这个问题，需要在整个文本中添加额外的字符来欺骗 IE 和 Edge，如下所示：

 var appendHeaderText = function (element) {
        if ($.isIE() || $.isEdge()) {
            element.childNodes[0].innerText += "_";
        }            
    };

var removeHeaderText = function (element) {
        if ($.isIE() || $.isEdge()) {
            var text = element.childNodes[0].innerText;
            element.childNodes[0].innerText = text.slice(0, text.length - 1);
        }
    };

        e.sender.thead.setTooltip("th", true, appendHeaderText, removeHeaderText);

【讨论】：