Chrome 扩展程序似乎忽略了 javascript 来启动新的 url

Question

所以当我点击加载解压时扩展安装就好了，我可以填写框。 单击后，我将其设置为仅启动 google.com，直到我找到它不工作的原因。 在我看来，javascript 根本没有运行。 脚本文件似乎被正确调用，我仔细检查了名称。

清单文件 - 我认为这里不需要调用 js 文件。

{
"manifest_version":2, 
"name": "Market Refresher Ext", 
"description": "This extension will push a url with parameters for facebook marketplace",
"version": "1.0", 

"browser_action":{
"default_icon": "icon.png",
"default_popup": "popup.html"
},
"permissions": [
"activeTab"]
}

html文件

<!DOCTYPE html>
<html>
   <head>
       <title>Market Refresher</title>
       <script src="popup.js"></script>
   </head>
   <body>
   
   <h1>Market Refresher</h1>
    <label for="City">City:</label>
    <input type="text" id="City" name="City"><br><br>

    <label for="daysSinceListed">DaysSinceListed:</label>
    <input type="text" id="daysSinceListed" name="daysSinceListed"><br><br>

    <label for="query">Query:</label>
    <input type="text" id="Query" name="query"><br><br>

    <label for="category_id">category_id:</label>
    <input type="text" id="CategoryId" name="Category Id"><br><br>

    <label for="Refresh">Refresh:</label>
    <input type="text" id="Refresh" name="Refresh"><br><br>

    <label for="MaxPrice">MaxPrice:</label>
    <input type="text" id="MaxPrice" name="Max Price"><br><br>

     
    <button id="StartRefreshing">Start Rotation!</button><br></br>


    
</body>
</html>

js 文件 - 我尝试添加一个警报（之前未注释）以查看它是否甚至进入了 java 脚本

document.getElementById("StartRefreshing").addEventListener("click", build);

//make a function that builds the string and then passes it to 
function build(){
//alert ("Hello World!");
 
//collect data from a text box if filled
let a = document.getElementById("City").value;
let b = document.getElementById("daysSinceListed").value;
let c = document.getElementById("Query").value;
let d = document.getElementById("CategoryId").value;
let e = document.getElementById("Refresh").value;
let f = document.getElementById("MaxPrice").value;
//alert (a+b+c+d+e+f);
//append to string if filled
//temporarily assume that it is all filled
let urlstring = "https://www.facebook.com/marketplace/" + a + "/search?daysSinceListed=1&query=" + c + "&category_id=" + d + "&exact=false";
//console.log(urlstring);
//window.location.href = "google.com";
chrome.tabs.update({
     url: "http://www.google.com/"
});
//place string into URL
}
//place string into URL

Answer 1

由于弹出窗口是一个单独的窗口，它有自己的开发工具。 在 Chrome 中，您可以在弹出窗口中右键单击，然后单击“检查”，您将在 devtools 控制台中看到有关尝试使用 null 的 addEventListener 的错误。 在 Firefox 中，方法是不同的。

问题是 popup.js 在其他元素添加到 DOM 之前运行。

解决方案1是在页面末尾加载脚本：

  <script src="popup.js"></script>
</body>
</html>

解决方案 2是在popup.js 中等待 DOMContentLoaded ：

document.addEventListener('DOMContentLoaded', () => {
  // here goes your old contents of popup.js
  // ....................
}, {once: true});

如果你使用 jQuery，你可以像这样使用$ $(() => { /* your code here */ }) ，文档。

Chrome 扩展程序似乎忽略了 javascript 来启动新的 url

问题描述

1 个解决方案

解决方案1
0 2020-08-31 04:48:20

Chrome 扩展程序似乎忽略了 javascript 来启动新的 url

问题描述

1 个解决方案

解决方案1 0 2020-08-31 04:48:20

解决方案1
0 2020-08-31 04:48:20