Chrome扩展程序按ID获取元素无法读取

时间:2019-04-01 10:37:09

标签: javascript html google-chrome dom google-chrome-extension

我的Chrome扩展程序中有一个HTML表单,用于处理登录页面,但出现以下错误:

  

未捕获的TypeError:无法读取null的属性'addEventListener'       在HTMLDocument。 (popup.js:5)

我想知道是否有人对如何解决此问题有任何想法?我将在下面附加代码。

manifest.json

{
    "manifest_version": 2,

    "name": "UA Prototype Plugin",
    "description": "A prototype plugin for Chrome",
    "version": "1.0",
    "author": "@Curtis",

    "background": {
        "scripts": ["popup.js"],
        "persistent": false
    },
    "permissions": [
        "tabs",
        "http://*/*",
        "https://*/*"
    ],
    "browser_action": {
        "default_icon": "logo.png",
        "default_popup": "popup.html"
    }
}

popup.html

<!doctype html>
<html>
<head>
    <script src="popup.js"></script>
</head>

<body>
    <h2>Welcome to UA Browser Prototype</h2>
    <a href="test.html">test</a>
    <!-- <p id='pagetitle'>This should change to the scraped title!</p> -->
<h3>Please login to your account below</h3>


<div class="container">
     <form id="dologin">
        <p>
            <label for="title">Username</label><br />
            <input type="text" id="username" name="username" placeholder="Username" />
        </p>
        <p>
            <label for="url">Password</label><br />
            <input type="password" id="password" name="password" placeholder="Password" />
        </p>
        <p>
            <input id="submit" type="submit" value="Login" />
        </p>
    </form>

</div>
</body>
</html>

popup.js

function doLogin() {
    alert("login");
}
document.addEventListener('DOMContentLoaded', function(event) {
    document.getElementById('dologin').addEventListener('submit', dologin);
});

0 个答案:

没有答案