无法访问Chrome扩展程序中的文本输入元素
[英]Unable to access text input element in chrome extension
问题描述
(I'm a relative beginner in chrome-extension development and to StackOverflow so bear with me) 
（我是chrome扩展程序开发和StackOverflow的相对入门者，请耐心等待）
I have a chrome extension that has a text input in the popup. 我有一个Chrome扩展程序，在弹出窗口中有一个文本输入。 I'm trying to obtain a "real-time" text data feed from the input field. 我正在尝试从输入字段中获取“实时”文本数据提要。
My JS (popup.js) and HTML (popup.html): 我的JS（popup.js）和HTML（popup.html）：
window.addEventListener('load', function(evt) { document.getElementById("input_field").onkeyup = function() { let inputValue = document.getElementById("input_field").value; alert(inputValue); someAction(inputValue); } });
<html> <head> <meta charset='utf-8'> </head> <body> <input type="text" id="input_field" placeholder="Blank"/> <div id = "root"> <p> Some Text </p> </div> </body> </html>
My manifest.json: 我的manifest.json：
{
"name": "SampleFormApp",
"version": "1.0",
"description": "Sample Text",
"manifest_version": 2,
"browser_action": {
"default_icon": "assets/icon.png",
"default_title": "Sample",
"default_popup": "src/html/popup.html"
},
"background": {
"scripts": ["src/js/popup.js"],
"persistent": false
},
"permissions": ["storage", "unlimitedStorage", "tabs", "<all_urls>"],
"content_scripts": [{
"matches": ["<all_urls>"],
"css": ["src/css/styles.css"]
}]
} }
However, when I try to run the extension, I get this error in the debug log: Uncaught TypeError: Cannot set property 'onkeyup' of null (from this line: document.getElementById("input_field").onkeyup = function() {). 但是，当我尝试运行扩展程序时，在调试日志中出现此错误：Uncaught TypeError：无法将属性'onkeyup'设置为null（从此行：document.getElementById（“ input_field”）。onkeyup = function（）{ ）。
From my understanding, the "input_field" element from the extension page (popup.html) is null and that is throwing me an error. 据我了解，扩展页面（popup.html）中的“ input_field”元素为null，这使我出错。 What should I do to solve this? 我该怎么做才能解决这个问题？ (I also am not too experienced with jQuery.) （我对jQuery也不太有经验。）
1 个解决方案
解决方案1
0 已采纳 2019-03-12 17:39:55
正如wOxxOm在评论中所述，我删除了manifest.json中的后台脚本部分，并添加了一个标准的src标记（src = popup.js）。
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.