1

我正在编写一个 chrome 扩展，在其中向页面添加一个按钮，然后向它添加一个 onclick 事件。因为我想添加更多按钮，所以我想让它动态化..

addAutoModButton('Auto-Moderate', 'moderate');

function addAutoModButton(name, onclickfunction)    {
    ...
    ...
    //creating a button and adding it
    var modbtn = document.createElement("input");
    modbtn.setAttribute('type','button');
    modbtn.setAttribute('value',name);
    title_header.appendChild(modbtn);

    modbtn.addEventListener("click", window["onclickfunction"], false);
    // thats what is not working

}

function moderate() {
    //do some stuff
}

建议？

4

2 回答 2

2

  • 您需要使用您定义的参数。

    function addAutoModButton(name, onclickfunction)    {
  ...
  modbtn.addEventListener("click", onclickfunction, false);
                               ----^^^^^^^^^^^^^^^--

  • 传递函数，而不是函数的名称。

    addAutoModButton('Auto-Moderate', moderate);
                               ---^^^^^^^^--

    不过，您需要先定义函数，然后再将其作为参数传递。

或者，您可以保持原样（但仅限于全局范围。）通过取消引用传递给 window.properties 的属性名称。

modbtn.addEventListener("click", window[onclickfunction], false);
                                     ---^^^^^^^^^^^^^^^---

window.onclickfunction从字面上看，在它静态解析为 之前。

于 2012-12-03T13:48:47.130 回答
0

函数是 JS 中的一等对象，因此您可以像对待任何其他变量一样对待它：

function someF(){}
function func2(argumentFunction)
{
    document.body.addEventListener('click',argumentFunction,false);//<-- use argument name
}
func2(someF);//<-- function someF will be used as callback

参数/变量是对函数对象的引用，这意味着 JS 并不真正关心函数的名称，它查看变量引用的内容，在这种情况下，参数引用了一个函数，该函数在其他地方声明但传递为一个论点。纯粹而简单

于 2012-12-03T13:49:41.097 回答