Question

我将onmouseout事件附加到Raphael圈子元素上，如下所示：

    (function(el,iElPos,col){
        el.mouseout(function elmouseout(){el.animate({"fill":col,"r":ELEMENT_RADIUS},150);
                               alert("first");
                               fadeTag();
                               });              
    )(c,i,elementColour);

c是元素。然后，我希望断开事件并依次附加另一个事件：

(function (el){
    el.attr("fill",EXCLUDED_COLOUR);
    el.unmouseout(elmouseout);
    el.mouseout(function elmouseout(){
                       alert("second");
                       el.animate({"fill":EXCLUDED_COLOUR,"r":ELEMENT_RADIUS},150);
                       fadeTag();
                       });
})(setMainSeries[iPos]);

但是这会附加两个事件。两个警报都在触发，后来附加的事件首先触发。我想完全断开第一个事件。我是否错误地使用了unmouseout（）？

更新

我尝试了echo-flow和lincolnk的建议，但都没有奏效。我认为echo-flow可能更有效。我按照建议打破了这个功能......

function elmouseoutDefault(el){
    el.animate({"fill":ELEMENT_COLOUR,"r":ELEMENT_RADIUS},150);
    alert("first");
    fadeTag();
};

然后在创建每个元素时附加了这样的事件...

el.mouseout(elmouseoutDefault);

然而，由于我没有通过el，这失败了。所以我把它改成了......

el.mouseout(elmouseoutDefault(el));

这似乎是在添加时调用elmouseoutDefault。我只希望它在mouseout事件上触发。

Answer 1

~~它看起来像是你在声明函数名称的问题 - 我认为当你用名字内联定义函数时，事情会变得棘手。这应该更可靠地保持参考功能。~~

var elmouseout = null;

(function (el, iElPos, col) {

    elmouseout = function () {
        el.animate( {"fill": col, "r": ELEMENT_RADIUS }, 150);
        alert("first");
        fadeTag();
    };

    el.mouseout(elmouseout);

})(c, i, elementColour);


(function (el) {

    el.attr("fill", EXCLUDED_COLOUR);

    el.unmouseout(elmouseout);

    elmouseout = function () {
        alert("second");
        el.animate( { "fill": EXCLUDED_COLOUR, "r": ELEMENT_RADIUS}, 150 );
        fadeTag();
    };

    el.mouseout(elmouseout);

})(setMainSeries[iPos]);

编辑：这是范围之物 - 您对elmouseout的定义仅存在于自调用函数的范围内。我正在考虑有关函数名称的另一个问题。代码应该仍然可以工作。

Answer 2

我想根据您的工作代码对此进行验证，但根据您发布的代码，这是我认为正在发生的事情：在两个代码段中，您都声明了一个函数“elmouseout”。您正在使用的函数声明语法声明了本地作用域中的函数（相当于编写“var elmouseout = function（）{...}”），并且因为您在单独的函数闭包中声明每个函数，所以变量“ elmouseout“在第二个代码块中引用来自第二个代码块的函数”elmouseout“，而不是第一个代码块，它将产生所需的行为。我建议打破函数声明，如下所示：

function elmouseout(e){e.target.animate({"fill":col,"r":ELEMENT_RADIUS},150);
                               alert("first");
                               fadeTag();
                               }

    (function(el,iElPos,col){
        el.mouseout(elmouseout);              
    )(c,i,elementColour);


function elmouseout2(e){
                       alert("second");
                       e.target.animate({"fill":EXCLUDED_COLOUR,"r":ELEMENT_RADIUS},150);
                       fadeTag();
                       }

(function (el){
    el.attr("fill",EXCLUDED_COLOUR);
    el.unmouseout(elmouseout);
    el.mouseout(elmouseout2);
})(setMainSeries[iPos]);

断开Raphael元素事件

2 个答案: