Question

我有以下代码：

 document.getElementById(this.config.dragArea).addEventListener("dragover", 
  function(e){ e.stopPropagation(); e.preventDefault(); }, false);
 document.getElementById(this.config.dragArea).addEventListener("drop",
  this._dropFiles, false);

//SAME CODE, DIFFERENT IDs
  document.getElementById(this.config.dragAreaMobi).addEventListener("dragover", 
       function(e){ e.stopPropagation(); e.preventDefault(); }, false);
  document.getElementById(this.config.dragAreaMobi).addEventListener("drop",
       this._dropFiles, false);

如果我不想复制所有这些代码，我该怎么办？反正有没有像document.getElementsById(var1, var2)这样的事情？（注意：dragArea = 'id1'和dragAreaMobi = 'id2'）。

我尝试使用jQuery：

 $(this.config.dragArea).bind("dragover", function(e){ e.stopPropagation(); e.preventDefault(); }, false);

此代码无效 - 我最好的猜测是bind和addEventListner之间的差异...... 在这个例子中，dragArea被定义为dragArea = '#id1, #id2'

Answer 1

创建一个函数并将该元素传递给函数

function bindEventListeners(elem){
    elem.addEventListener("dragover", function(e){ e.stopPropagation(); e.preventDefault(); }, false);
    elem.addEventListener("drop", this._dropFiles, false);
}

bindEventListeners(document.getElementById(this.config.dragArea));
bindEventListeners(document.getElementById(this.config.dragAreaMobi));

JavaScript：getElementById - 避免代码重复

1 个答案: