dxTooltip无法在IE中工作，在Chrome中工作 [英] dxTooltip not working in IE, working in Chrome

问题描述

我有一个 dxChart ：

  var chart = $ （ ＃chartContainer4）dxChart（）; 
  

其中我正在使用图例矩形：

  var PayerLegendBoxes = $（＃chartContainer4 .dxc-legend g rect）; 
  

使用 dxTooltip 显示鼠标悬停。
$ b $ pre $ PayerLegendBoxes.each（function（）{



var nextElementHTML = this.nextSibling.innerHTML;

var currElementTip = nextElementHTML +tip;

var currElement = this;



var title = chart.append（< span style ='display：none;'id =+ currElementTip +>+ nextElementHTML +< / span>）;



var tooltipSimple = $（＃+ currElementTip）.dxTooltip（{
$ b $ target：currElement，

}）。dxTooltip （instance）;



$（currElement）.unbind（）。hover（function（）{

tooltipSimple.toggle（）

}）;



}）;


这可以在Chrome中正常工作，但不会在IE中使用。

是否存在跨浏览器功能的错误？

解决方案

看起来问题出在这一行：

  var nextElementHTML = this.nextSibling.innerHTML; 
  

nextSibling.innerHTML 返回<$ c $在IE中c> undefined 。所以，我建议你使用这样的东西：

  // jQuery提供了一个跨浏览器的方式
 var nextElementHTML = $（this）.next（）。text（）; 
  

另外还有一条更正：

  var currElementTip = nextElementHTML +tip; 
  

nextElementHTML 有时可以包含空格符号。所以，你应该清理它：

  var currElementTip =（nextElementHTML +tip）。replace（/ \s / g ，_）; 
  

更新后的示例在​​这里 - http://jsfiddle.net/5y8f4zt0/

I have got a dxChart:

            var chart = $("#chartContainer4").dxChart();

of which I’m taking the legend rectangles:

            var PayerLegendBoxes = $("#chartContainer4 .dxc-legend g rect");

And using dxTooltip for showing on mouse hover.

            PayerLegendBoxes.each(function () {



                var nextElementHTML = this.nextSibling.innerHTML;

                var currElementTip = nextElementHTML + "tip";

                var currElement = this;



                var title = chart.append("<span style='display:none;' id=" + currElementTip + ">" + nextElementHTML + "</span>");



                var tooltipSimple = $("#" + currElementTip).dxTooltip({

                    target: currElement,

                }).dxTooltip("instance");



                $(currElement).unbind().hover(function () {

                    tooltipSimple.toggle()

                });



            });

This is working fine in Chrome but not in IE.

Is there a bug for cross browser functionality?

解决方案

Looks like the problem is in this line:

var nextElementHTML = this.nextSibling.innerHTML;

nextSibling.innerHTML returns undefined in IE. So, I suggest you use something like this:

// jQuery provides a "cross-browser" way here
var nextElementHTML = $(this).next().text();

And one more correction for this line:

var currElementTip = nextElementHTML + "tip";

nextElementHTML can sometimes contain a white space symbol. So, you should sanitize it:

var currElementTip = (nextElementHTML + "tip").replace(/\s/g, "_");

The updated sample is here - http://jsfiddle.net/5y8f4zt0/

这篇关于dxTooltip无法在IE中工作，在Chrome中工作的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！