Javascript-Chrome扩展中的数据传递问题

问题描述

我创建了一个JavaScript函数，并将其保存在pop.js个文件中。

这是我的popup.html文件：

<html>
<head>
    
<title>News Verifier</title>
    <link rel="stylesheet" type="text/css" href="style.css">
    <script src="popup.js"></script>


<body>
    <div class="popupBox">
        <img src="NV.png" alt="logo" width="100" height="100" class="image">
        <h1>News Verifier</h1>
        <form>
            <p class="instruct">copy and paste the news below</p>
            
            <textarea id="news" class="input" name="paragraph_text" cols="50" rows="10" placeholder="Paste here"></textarea>
            <br><br><br>
            <input  type="submit" class="button"  onlick="GetResult();" value="Verify">            
            <br><br>

           
            
        </form>
        
    </div>

</body>
</head>
</html>

popup.js文件：


function GetResult()
{
                    var news = document.getElementById('news').value;
                    alert(news);


}

manifest.json文件：

{
    "manifest_version": 2,"name": "News Verifier","description": "This extension Prints the news entered in textBox","version": "1.0","background": {
        "scripts": ["popup.js"],"persistent": false
    },"icons": {
        "128": "NV.png","48": "NV.png","16": "NV.png"
    },"browser_action": {
        "default_icon": "NV.png","default_popup": "popup.html"
    },"permissions": [
        "storage","notifications","contextMenus"
    ]
}

理想情况下，每当我单击“验证”时，应调用我的函数，并弹出一个对话框，其中应显示在文本框中输入的值，但每当单击“验证”时，都不会发生任何事情。我没有任何弹出框。

感谢您为我的问题提供了重要的时间。谢谢你

解决方法

有2个错误：

onclick的拼写为onlick（尚不存在；））
输入submit类型的输入将提交相关表格，使用type='button'

function GetResult() {
  var news = document.getElementById('news').value;
  alert(news);
}

<html>
<head>
    
<title>News Verifier</title>
    <link rel="stylesheet" type="text/css" href="style.css">
    <script src="popup.js"></script>


<body>
    <div class="popupbox">
        <img src="NV.png" alt="Logo" width="100" height="100" class="image">
        <h1>News Verifier</h1>
        <form>
            <p class="instruct">Copy and paste the news below</p>
            
            <textarea id="news" class="input" name="paragraph_text" cols="50" rows="10" placeholder="Paste here"></textarea>
            <br><br><br>
            <input class="button" type="button" onclick="GetResult();" value="Verify">            
            <br><br>

           
            
        </form>
        
    </div>

</body>
</head>
</html>

content-security-policy google-chrome google-chrome-extension javascript textbox textbox