İçerik içerikli komut dosyalarında tetikleme yok Chrome uzantısı

Question

Bir content scripts Chrome uzantısı yapıyorum. Bir web sayfasına dinamik olarak bir düğme ekledim, ancak bu düğmedeki olay dinleyicisi tetiklenmeyecek. İşte

manifest.json geçerli:

{ 
    "manifest_version": 2, 
    "name": "my extension", 
    "browser_action": { 
    "default_icon": "icon.png", 
    "default_popup": "popup.html" 
    }, 
    "permissions": [ 
    "activeTab" 
    ], 
    "content_scripts": [ 
     { 
     "matches": ["http://127.0.0.1:8000/*"], 
     "js": ["jquery.js", "script.js"], 
     "run_at": "document_end" 
     } 
    ] 
} 

Bu script.js geçerli:

document.body.style.backgroundColor = "yellow"; 
var button = $('<input id="btn" type="button"/>'); 
$("body").append(button); 

$("#btn").on("click", function(){ 
    document.body.style.backgroundColor = "red"; 
}); 

düğmesi sarıya sayfa ve arka plan değişiklikleri eklenir, ancak kırmızı tıklayarak düğmeye değişmez .

Answer 1

Bu benzersiz kimlik size yardımcı olabilir; şüphelenilen konu düğme kimliği ile ise)

document.body.style.backgroundColor = "yellow"; 
uniqueId = 'btn' + Date.now(); 
var button = $('<input id="' + uniqueId + '" type="button"/>'); 
$("body").append(button); 

$("#" + uniqueId).on("click", function(){ 
    document.body.style.backgroundColor = "red"; 
}); 

Answer 2

- Aksi hiç ID ihtiyaç duyduğunu unutmayın.

document.body.style.backgroundColor = "yellow"; 
var button = $('<input id="btn" type="button"/>'); 
$("body").append(button); 

button.on("click", function(){ // Notice you don't need to search for it again! 
    document.body.style.backgroundColor = "red"; 
}); 

Ancak bu durumda yeniden bulmak için button değişkeni tutmak gerekir.