Question

我有以下代码重复一次，只有一些变化：

$('#mapContainer').on({
    mouseenter: function () {
        Map.ApplyEvents.Country(this.id);
    },
    click: function () {
        Map.Zoom.State(this.id);
    }
},
'.mapaCountry path');

// this is in another function
$('#mapContainer').on({
    mouseenter: function () {
        Map.ApplyEvents.State(this.id);
    },
    click: function () {
        Map.Zoom.County(this.id);
    }
},
'.mapaState path');

在所有事件中，我必须调用一个匿名函数来调用内部的1个函数。

有没有办法将此代码分配处理程序压缩到所需的函数，还能通过this.id通知参数？

我想达到这样的目的：
（注意：我知道它的语法错误。）

$('#mapContainer').on({
    mouseenter: Map.ApplyEvents.Country(this.id),
    click: Map.Zoom.State(this.id)
},
'.mapaCountry path');

$('#mapContainer').on({
    mouseenter: Map.ApplyEvents.State(this.id);
    click: Map.Zoom.County(this.id)
},
'.mapaState path');

Answer 1

恕我直言，你的第一个片段是达到你想要的最惯用的方式。

如果你真的有数以万计的这种绑定，并且你的Map API只包含一个单独的字符串参数的函数，那么你可以想出一个自定义的绑定器：

$.fn.bindIDlistener = function(handlers, sel) {
    var wrapper  = {}, evt;
    for (evt in handlers) {
        wrapper[evt] = function(){ handlers[evt](this.id); };
    }
    this.on(wrapper, sel);
}

//usage :
$('#mapContainer').bindIDlistener({
    mouseenter: Map.ApplyEvents.Country,
    click: Map.Zoom.State
},
'.mapaCountry path');

$('#mapContainer').bindIDlistener({
    mouseenter: Map.ApplyEvents.State,
    click: Map.Zoom.County
},
'.mapaState path');

但是我仍然建议强烈思考这种方法的小优点（每个事件处理程序20个字符），以防止你遇到的快速限制（在链中添加另一个故障点，代码对外部方的可读性较差，难以将第二个参数传递给处理程序等...）

Answer 2

我知道我之前对此感到恼火。如果我没记错的话，这是一个宣言问题。

我认为这不起作用。

function myFunction(){}

这样做。

var myFunction() = function(){}

也许这并不能解决您的确切问题，因为我不知道您的职能是如何宣布的。

在jQuery中使用函数handler + parameter调用事件

2 个答案: