Question

我有一个ID，我想为它分配两个函数。以下是目前的情况：

document.getElementById(this.config.dragArea).addEventListener("drop", this._dropFiles, false);
document.getElementById(this.config.dragArea).addEventListener("drop", this._handleFileDrop, false);

如何在没有这么多重复的情况下重写此文件？

我试过

document.getElementById(this.config.dragArea).addEventListener("drop", this._dropFiles, this._handleFileDrop, false);

和

document.getElementById(this.config.dragArea).addEventListener("drop", function(){this._dropFiles; this._handleFileDrop}, false);

一切都无济于事:( 允许使用jQuery解决方案

Answer 1

这会更有效：

var dragArea = document.getElementById(this.config.dragArea);
dragArea.addEventListener("drop", function () {
  that._dropFiles();
  that._handleFileDrop();
}, false);

如果你有很多事件监听器，那么你可以创建一些循环，分配一大堆this._doX函数，但对于这两个监听器，这可能过于复杂。

使用jQuery：

var dragArea = $(this.config.dragArea);
var that = this;
dragArea.on("drop", function () {
  that._dropFiles();
  that._handleFileDrop();
});

Answer 2

如果你真的想干些东西......

[this._dropFiles, this._handleFileDrop].forEach(function(fun){
    document.getElementById(this.config.dragArea).addEventListener("drop", fun);
});

请注意，IE8上需要forEach的垫片。

您还可以更合理地将document.getElementById(this.config.dragArea)存储在变量中并重复使用。

JavaScript / jQuery：一个ID，两个函数。如何以最少的代码重复执行此操作？

2 个答案: