Fatal编程技术网

Google chrome extension 创建chrome扩展名后，它无法访问popup.js文件

google-chrome-extension

Google chrome extension 创建chrome扩展名后，它无法访问popup.js文件,google-chrome-extension,Google Chrome Extension,manifest.json { "name": "Summer", "version": "1.0", "manifest_version": 2, "description": "This is an addition extension", "browser_action": { "default_icon": "icon.png", "default_popup": "popup.html" } } popup.html <!doctype

manifest.json

{
  "name": "Summer",
  "version": "1.0",
  "manifest_version": 2,
  "description": "This is an addition extension",
  "browser_action": {
    "default_icon": "icon.png",
    "default_popup": "popup.html"
  }
}
popup.html

<!doctype html>
<html>
  <head>
    <title>Getting Started Extension's Popup</title>

    <!-- JavaScript and HTML must be in separate files for security. -->
    <script src="popup.js"></script>
  </head>
  <body>
        <form name="form">
            <div id="sayi1">Sayı 1 :    <input type = "text" name="deger1"></div> 
            <div id="sayi2">Sayı 2 :    <input type = "text" name="deger2"></div> 
            <div id="sonuc">Sonuç :     <input type = "text" name="cevap"></div>
            <div id="button"><input type="button" value="Hesapla" onclick="hesaplama()" /></div>
        </form>
  </body>
</html>
当我加载这个扩展时，我可以正常地看到。但当我填写deger1和deger2文本框并单击按钮时，函数不起作用，sonuc文本框（结果文本框）中的值为空。
我怎样才能修好它？我在创建chrome扩展方面是新手。感谢您的帮助。

您的清单中有
清单\u版本：2
，因此请阅读清单中介绍的更改….

由于内容安全策略，由于html中的onclick事件处理程序（
），您在控制台中得到了拒绝执行内联事件处理程序的
。对于清单版本2，这是不允许的，您需要从js代码而不是html中附加事件列表器。

这是您的代码的工作版本……

popup.html


<!doctype html>
<html>
  <head>
    <title>Getting Started Extension's Popup</title>

    <!-- JavaScript and HTML must be in separate files for security. -->
    <script src="popup.js"></script>
  </head>
  <body>
        <form name="form">
            <div id="sayi1">Sayı 1 :    <input type = "text" name="deger1"></div> 
            <div id="sayi2">Sayı 2 :    <input type = "text" name="deger2"></div> 
            <div id="sonuc">Sonuç :     <input type = "text" name="cevap"></div>
            <div id="button"><input type="button" value="Hesapla" /></div>
        </form>
  </body>
</html>



function hesaplama()
{
var sayı1 = window.document.form.deger1.value;
var sayı2 = window.document.form.deger2.value;
var toplam = (parseFloat(sayı1) + parseFloat(sayı2)) ;
window.document.form.cevap.value = toplam;
}
window.onload = function(){
    document.querySelector('input[value="Hesapla"]').onclick=hesaplama;
}



滥用
eval
？改为使用
parseFloat（比如\u01311）+parseFloat（比如\u01312）
。控制台中是否有错误？1.您在输入中输入了什么？2.尝试在控制台中单独运行每一行，以确保您期望发生的事情实际上就是正在发生的事情。2.1我的意思是确保DOM调用返回一个值，查看
eval（say11）
在控制台上给您提供的内容等“由于内容安全策略而拒绝执行内联事件处理程序”。欢迎：）哦，您可能应该向该输入添加一个
id
，并更改查询选择器以查找该内容。

function hesaplama()
{
var sayı1 = window.document.form.deger1.value;
var sayı2 = window.document.form.deger2.value;
var toplam = (parseFloat(sayı1) + parseFloat(sayı2)) ;
window.document.form.cevap.value = toplam;
}
window.onload = function(){
    document.querySelector('input[value="Hesapla"]').onclick=hesaplama;
}