gpt4 book ai didi

javascript - 将 JS 事件监听器添加到 Chrome 扩展弹出窗口

转载 作者:行者123 更新时间:2023-11-30 13:49:43 26 4
gpt4 key购买 nike

我正在构建 Chrome 扩展程序,但在添加事件监听器时遇到了一些问题。我想将它添加到弹出窗口中的按钮。

这是 JS -

document.addEventListener('DOMContentLoaded', function () {
document.getElementById('checkButton').onclick = grabLinks;
});

这是弹出式 HTML -

<!DOCTYPE html>
<html>
<head>

<script src="background.js"></script>

</head>
<body>

<h3>Duplink</h3>

<p>Check if a link is already on this page.</p>
<form>
URL: <input id="URL" type="text" name="URL"><br>
<input id='checkButton' type="submit" value="Submit">
</form>

<p>Link is:<span id="message"></span></p>

</body>
</html>

此外,这里是 manifest.json 以防万一 -

{
"name": "Duplink",
"version": "1.0",
"description": "Check for duplicate links on DotDash sites",
"manifest_version": 2,
"background": {
"scripts": [
"background.js",
"popup.js"],
"persistent": false
},
"browser_action": {
"default_popup": "popup.html",
"default_title": "Duplink"
},
"permissions": [
"activeTab",
"storage"
]
}

当我解压缩扩展程序时,出现此错误。 - 事件处理程序中的错误:TypeError:无法将属性“onclick”设置为 null

然后它一遍又一遍地重复这个错误。 - Uncaught TypeError: 无法读取未定义的属性“addListener”

最佳答案

还使用 addEventListener 将事件绑定(bind)到按钮:

检查下面的代码:

document.addEventListener('DOMContentLoaded', function () {
var btn = document.getElementById('checkButton');
btn.addEventListener('click', function() {
alert("button clicked");
});
});

关于javascript - 将 JS 事件监听器添加到 Chrome 扩展弹出窗口,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/58514456/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com