先看這段代碼

1 function abc(key){
2     console.log(key);
3 }
4 for(let i=0;i<oInput.length;i++){
5     oInput[i].addEventListener(‘focus‘,abc(i));
6 }

會發現focus這個操作還未執行，i的值已被依次打印出來。

如何傳入傳參函數而不被立即執行呢，方法一：給addEventListener綁定一個匿名函數。

element.addEventListener(‘mouseover‘,function(e,some){ fn(e,some); });

tip：綁定匿名函數的話不能使用removeEventListener移除事件。

方法二：bind方法。bind和call/apply相似，通常用於改變函數的this的指向，不過和後二者不同，bind中不額外加()操作符，就不會立即函數。對於這個特性，也正是我們在這裏所需要的。

function abc(key){
    console.log(key);
}
    for(let i=0;i<oInput.length;i++){
        oInput[i].addEventListener(‘focus‘,abc.bind(this,i));
}  

tip：bind是ES5中的方法，不兼容ie8。需要兼容的話MDN上有對應的polyfill。

js addEventListener調用傳參函數