在 raphaeljs 中悬停不工作答案

【问题标题】：unhover in raphaeljs not working在 raphaeljs 中悬停不工作
【发布时间】：2011-04-03 15:15:08
【问题描述】：

我目前正在将匿名函数应用于悬停事件，它在内部调用全局函数：

GridInterface.HexGrid.TileGlobal = {

hoverIn: function(obj) {
  var self = obj;
  self.tile.attr({ fill: '#c7c7c7', stroke : '#000' });
  self.tile.toFront();
  self.label.toFront();
  self.label.attr({ fill : '#000' });
},

hoverOut: function(obj) {
  var self = obj;
  self.tile.attr({ fill : '#d0d1ff', stroke : '#aaa' });
  self.label.attr({ fill: '#999' });
}
}

然后我只需调用：

 .hover(function() {
        GridInterface.HexGrid.TileGlobal.hoverIn(self);
      }, function() {
        GridInterface.HexGrid.TileGlobal.hoverOut(self);
      }
    )

在对象上。但是，当我将其切换为取消悬停时，该事件不会被删除。我认为这是因为它是一个不同的匿名函数。关于如何解决的任何想法？

【问题讨论】：

另见stackoverflow.com/questions/6315456/…，它描述了相同的问题，包括悬停，并通过一个有效的 jsfiddle 示例给出了答案

标签： raphael

【解决方案1】：

    GridInterface.HexGrid.Tile = function(coords) {

        var self = this;


        this.hoverIn = function() {
          this.attr({ fill: '#c7c7c7', stroke : '#000' });
        };

        this.hoverOut = function() {
          this.attr({ fill: '#d0d1ff', stroke: '#aaa' });
        };

        this.attachEvents = function()
        {
          self.el[0].hover(self.hoverIn, self.hoverOut);
        };
    };

然后我打电话给其他地方：

tile.el[0].unhover(tile.hoverIn, tile.hoverOut);

Tile 是上述函数的对象实例。

【讨论】：

【解决方案2】：

也许不是通过 raphäel 事件处理解决问题，而是使用您选择的库，即 jQuery：$(circle.node).click(...)

你可以按需添加事件/删除事件。

【讨论】：