Question

我正在尝试使用Raphael JS，但jQuery选择器似乎与IE8中的Raphael JS不兼容。

在Chrome和Firefox中，这可行：

  var paper = ScaleRaphael("test", 500, 500);

  var c = paper.circle(50, 50, 40);

  c.node.setAttribute('class','bluecircle');

  $('.bluecircle').attr({fill: 'blue'});

但是在Internet Explorer（使用VML而不是SVG的IE8）中没有显示任何内容。

基本上我要做的是给每个对象一个类，所以我可以使用Jquery选择器一次操作具有某个类的所有对象......

有没有人知道如何做到这一点，这也适用于IE？

Answer 1

这与使用类来处理一组对象并不完全相同，但我写了一个patch against Raphael来允许命名集。只需使用paper.set('uniqueID', element1, element2, ...)调用即可。元素包含一个groups数组，其中包含已分配给它们的每个组，而顶部的Raphael纸质对象具有一个由“uniqueID”键入的组字典。

以下测试代码显示了如何将悬停处理程序应用于命名集，并使用悬停回调在悬停时将该组的所有成员变为黑色：

var marker1 = paper.circle(50, 20, 10).attr({'fill' : '#ff0000'});
var marker2 = paper.circle(100, 20, 10).attr({'fill' : '#ff0000'});
var marker3 = paper.circle(150, 20, 10).attr({'fill' : '#ff0000'});
var marker4 = paper.circle(200, 20, 10).attr({'fill' : '#ff0000'});

var s = paper.set('setID', marker1, marker2);
s.push(marker3, marker4);
s.pop();

// If marker 1, 2, or 3 is hovered, act on whole group
s.hover(function() {
  for (var i = 0, ii = this.groups.length; i < ii; ++i) {
    var set = this.paper.groups[this.groups[i]];
    for (var j = 0, jj = set.items.length; j < jj; ++j) {
      set.items[j].attr({'fill' : '#000000'});
    }
  }
});

Answer 2

我试试

c.node.className = 'bluecircle';

Raphael JS：如何在IE中的对象上使用jQuery选择器？

2 个答案: