Javascript 谁能澄清一下拉斐尔'；s文档？（或者知道某个地方已经有人这样做了）

我正在与拉斐尔合作，我认为我使用它的方式没有利用一些似乎有用的特性

例如，我试图在一个集合（一组元素）上添加一个监听器，通过这种方式，当鼠标滑过其中任何一个元素时，脚本就会在整个集合上触发动画

将侦听器添加到集合时，Raphael会将侦听器添加到每个元素，并分别设置它们的动画

正如您在本例中看到的，我希望相同集合中的所有矩形（集合=由10个矩形组成的水平组）在其中任何一个上更改鼠标的颜色属性

我在raphael文档中找到了一些方法，我认为这些方法一定有助于实现这一目标。但是我很难理解这些方法是如何工作的

例如：

• eve对象（）
• Element.animateWith（）方法（）
• Raphael.animation（）方法（）

Raphael库似乎非常强大，我真的很想让它正常工作，我不想编写各种不同的javascript攻击，因为我认为这些工具必须以更优雅的方式完成工作

如果你认为我用错了图书馆，我仍然愿意接受各种建议。 先谢谢你

---编辑---

这是一个有效的示例（）。但这是一种缺乏效率和优雅的黑客行为。我想要以正确的方式使用正确的工具的东西

这页上有一些信息。有几个例子，但没有解释拉斐尔是如何工作的

看看这个，我想它正符合你的要求。基本区别在于，您希望在集合中调用animate，而不是

this

。似乎在向集合添加处理程序时，

此

引用集合中的单个元素（迭代以分配处理程序），而不是集合本身

请注意，我将处理程序函数拉入了getHoverHandler函数：

function getHoverHandler(fillColor) {
     var cSet = set;

     return function(){
          cSet.animate({fill: fillColor}, 300);
      };
}

set.hover(getHoverHandler('#000'),
          getHoverHandler('#FFF'));

为了打破封闭。如果您尝试这样做：

set.hover(function(){
            set.animate({fill: '#000'}, 300)
        }, function(){
            set.animate({fill: '#FFF'}, 300)
        });

在循环过程中，set将不断更改，闭包将保持对此的意识。因此，所有处理程序都将作用于最后一行框

---

如果您不了解javascript闭包，您可能想看看这个。它很古老，但用非常简单的语言来说，它帮助了我，因为我已经试着去了解它们。

Kreek在上面的评论中是绝对正确的。集合是SVG和VML之间不一致的解决方法

在上面的示例中，您遇到的问题与在中遇到的问题相同。在匿名函数中使用this几乎总是不会以您期望的方式工作，因为this不会指您认为它是什么。请看一看，特别是评论部分的前两条评论。（作为旁白，评论者用“自我”来指代“这个”，这比我的“那个”要好得多，这表明总有人做得比你更好）

无论如何，考虑到这一点，我把你的小提琴，把你的集合包装在一个对象中，并把事件放入对象构造函数中。通过执行此操作，事件可以引用.set并同时设置集中所有对象的动画

这是一个小而基本的概念，它将帮助您完成任何Raphael（或javascript）开发

这并不能直接回答你的问题，但希望能澄清一些你似乎正在发现的问题。我真的不能对你提到的动画电话发表评论，但我确实认为拉斐尔作为一个图书馆绝对值得坚持

---

N.

Raphal中的集合令人困惑，我想你和我一样，第一次想到集合就像SVG中的g元素（组）。然而，正如您所发现的，它更像是一个对象数组。我认为这与SVG和VML之间的差异有关（VML用于Internet Explorer版本<9，但不支持SVG，是的，IE再次破坏了每个人的SVG）。如果您不需要IE<9支持，您可能需要看看d3.js。谢谢。我终于明白在这个特殊情况下问题出在哪里了。我还是一个编程新手，在实践中你会学到一些概念。然而，我仍然想了解拉斐尔的一些特征，我认为这些特征有助于解决这些问题。我将使用你给我的关于悬停案例的解决方案，并始终关注这个关键字指向的方向。你认为在应用程序的其他部分引用集合的最佳方式是什么，也就是说，以某种方式使集合可行，用于在诸如删除鼠标悬停单击事件之类的事件上使用它们。我已经为集合中的每个元素设置了一个Id，并对其进行了引用，例如setA_1 setA_2 setB_1 setB_2。但是我不知道这是否是最好的主意。如果不了解应用程序的更多信息，很难说什么是最好的，但是您可能希望使用jQuery并使用类似

$（'#rects'）.data（'set#'+index，set）

的东西将它们与纸张一起存储。然后它们就可以在全球范围内使用了。您可以使用Raphael的Element.data（），但不确定在这种情况下是否真的希望它们与Raphael元素关联。是的，我将接受您的答案，因为它对我非常有帮助。但我希望有人能回答我最初的问题，关于拉斐尔图书馆的澄清。是的，现在我对这个特殊案例中的问题有了更好的理解。在地图示例中，在您帮助我解决问题后，我能够看到问题。但现在我了解了解决方案，以及解决方案的工作原理。再次感谢你！！那太疯狂了。。。但它是有效的。。。我