javascript - 将按钮插入到内容脚本的 DOM 中

Question

我正在编写一个 Firefox 扩展，但遇到以下问题:

我在内容脚本 (insertInDom.js) 中添加了一个按钮

$('#leftCol').append("<input type='button' value='Check Privacy' onclick=\"buttonClick()\" >");

用户单击按钮后，应启动内容脚本中的函数，但我总是收到错误 Fehler:buttonClick 未定义

我如何对脚本中插入按钮的事件使用react？谢谢:)

整个相关代码:

main.js

var pageMod = require("page-mod");
pageMod.PageMod({
    include: ["http://www.facebook.com/"],
    contentScriptWhen: 'ready',
    contentScriptFile: [data.url('jquery-1.6.4.js'),
                       data.url('insertInDom.js')],
    onAttach: function(worker) {
        worker.port.on('buttonClicked', function(content) {
            console.log(content);
        });
    }
});

插入InDom.js:

function buttonClick(){
    self.port.emit("buttonClicked", "true");
}

$('#leftCol').append("<input type='button' value='Check Privacy' onclick=\"buttonClick()\" >");

Answer 1

从 jQuery 1.7 开始，我认为添加点击事件的适当方法(甚至是在加载初始页面后创建的 DOM 元素)如下所示:

$("#dataTable tbody tr").on("click", function(event){
alert($(this).text());
}); 

文档:http://api.jquery.com/on/

因此，您可以尝试在输入中添加 ID，然后添加类似以下内容的内容:

   $("#myInput").on("click", function(event){
      self.port.emit("buttonClicked", "true");
    });