OnClick 事件在我的 chrome 扩展中不起作用 [重复]

Question

我做了一个小扩展，将按钮插入到 html 页面中，并且我在每个按钮上插入了 onClick 事件，但是当我按下它们时它们不起作用。我在这个网站上找到了一些主题，一个人在谈论addEventListener，但我无法使用它。我的代码是这样的：

var setButton = "<button type='button' id='setter2' onclick=Set_one(this.id)>set</button>";
var str = getRow.insertCell(-1);
str.innerHTML = setButton;

Answer 1

在 Chrome 扩展程序中，内联代码是 forbidden。扩展脚本和 CSP cannot be relaxed 完全不能使用 onclick 属性。

您必须使用addEventListener 才能使其工作。这并不难，并且在上面链接的文档中有介绍。

var setButton = "<button type='button' id='setter2' onclick=Set_one(this.id)>set</button>";
var str = getRow.insertCell(-1);
str.innerHTML = setButton;
document.getElementById("setter2").addEventListener("click", function() {
  Set_one(this.id);
});

如果你不使用innerHTML赋值并直接创建/附加元素，那就更好了：

var setButton = document.createElement("button");
    setButton.textContent = "set";
    setButton.id = "setter2";
    setButton.addEventListener("click", function() {
      Set_one(this.id);
    });
getRow.insertCell(-1).appendChild(setButton);