chrome 扩展清单 v2 和 div 元素中的 onclick 事件答案

【问题标题】：chrome extension manifest v2 and onclick events in a div elementchrome 扩展清单 v2 和 div 元素中的 onclick 事件
【发布时间】：2012-08-11 18:40:49
【问题描述】：

我正在将 chrome 扩展从 manifest v1 转换为 manifest v2。

我已从 html 文件中提取了大部分 javascript 代码并将其放入单独的 .js 文件中。

弹出窗口中的 div 元素有问题。

popup.html 中的当前代码是：

  <div onclick="PopupClick('SHOW')" id="blue">Show</div>

显然 onclick="" 从 v2 开始在 html 中是不允许的，但是如何替换它，这样用户可以点击 div 并执行一个函数？

【问题讨论】：

您阅读过文档吗？它清楚地说明了替代方案：code.google.com/chrome/extensions/…

标签： google-chrome google-chrome-extension

【解决方案1】：

popup.html:

 <script src="popup.js" type="text/javascript"></script>

 <div id="blue">Show</div>

popup.js:

 document.addEventListener('DOMContentLoaded', function () {  
 document.getElementById("blue").addEventListener('click',
 clickHandler); }); 

function clickHandler(e) {   PopupClick('SHOW'); }

 function PopupClick(str) {
   //Do your thing here 
}

就像 Rob W 说的，http://developer.chrome.com/extensions/contentSecurityPolicy.html#H3-1 很清楚

我实际上遇到了这个问题，这段代码帮助我从清单 v1 迁移到 v2。

【讨论】：

【解决方案2】：

也许是事件？在 popup.html 的头部包含 <script src="js/my_script.js"> 之类的内容，然后将代码粘贴到该 js 文件中。

var blueDiv = document.getElementById("blue");
    blueDiv.addEventListener("click", function(){
        PopupClick("SHOW");
    }, false);

或者您的应用程序的某些细节不允许您这样做？或者我不明白这个问题。

【讨论】：