我做了一個小擴展來阻止網站上的圖片,我可以通過彈出窗口打開和關閉。除了檢查它是否應該阻止圖像的部分之外,我得到了所有的工作。這是我的時刻了:如果background.js中的條件不起作用
的manifest.json
{
"manifest_version": 2,
"name": "Name",
"description": "Description",
"version": "1.0",
"icons": { "256": "256icon.png",
"128": "128icon.png",
"64": "64icon.png",
"48": "48icon.png",
"32": "32icon.png",
"16": "16icon.png" },
"browser_action": {
"default_title": "Name",
"default_popup": "popup.html"
},
"background": {
"scripts": [
"background.js"
],
"persistent": true
},
"permissions": [
"webRequest",
"webRequestBlocking",
"activeTab",
"tabs",
"webNavigation",
"management",
"http://*/*",
"https://*/*",
"*://static2.gamekit.com/upload/*"
]
}
popup.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title></title>
<link rel="stylesheet" href="popup.css">
</head>
<body>
<script src="popup.js"></script>
<div class="PopUp" id="PopUp">
<div class="onoffswitch">
<input type="checkbox" name="onoffswitch" class="onoffswitch-checkbox" id="myonoffswitch">
<label class="onoffswitch-label" for="myonoffswitch">
<span class="onoffswitch-inner"></span>
<span class="onoffswitch-switch"></span>
</label>
</div>
</div>
</body>
</html>
popup.js
document.addEventListener('DOMContentLoaded', function() {
'use strict';
var bg = chrome.extension.getBackgroundPage();
document.getElementById("myonoffswitch").checked = bg.onoffstate;
}); //gets checkbox state from background.js and applies it
function updatecheck() { //onclick function of the checkbox
'use strict';
//puts checkbox state in var (checkstate)
var checkstate = document.getElementById("myonoffswitch").checked;
//sends checkbox state to background.js
chrome.runtime.sendMessage({onoffstate: checkstate}, function (response) {
console.log(response.bg_onoffstate); //response from background.js
});
}
document.addEventListener('DOMContentLoaded', function() {
'use strict';
document.getElementById('myonoffswitch').addEventListener('click', updatecheck);
}); //adds onclick event to checkbox
background.js
var onoffstate;
chrome.runtime.onMessage.addListener(
function (request, sender, sendResponse) {
'use strict';
onoffstate = request.onoffstate; //puts checkbox state from popup.js into var
sendResponse({bg_onoffstate: onoffstate}); //debug response
}
);
if (onoffstate === true) { //check if checkbox is checked
chrome.webRequest.onBeforeRequest.addListener(
function (details) {
'use strict';
return {cancel: true};
},
{urls: ["*://static2.gamekit.com/upload/*"]},
["blocking"] //blocks images
);
}
(對不起,亂碼)
當加載popup.html它從background.js拉保存的狀態(true/false)並將其應用於複選框。當檢查popup.html中的(un)複選框時,它會將其狀態發送到background.js。 background.js中保存的狀態將決定圖像是否被阻擋。這就是它不適用的地方。阻止圖像本身的代碼本身完美地工作。但是當我把它放入if
函數時,它不會觸發。我試圖在其中放入其他東西來看它是否會執行它,但它沒有。
我在尋找是否有錯別的地方,但沒有找到任何東西。 JSLint也沒有顯示任何內容。
我希望有人能找出什麼是錯的。
鏈接到文件更容易獲得:Here
看起來你在監聽者獲得狀態之前敲擊了你的條件。嘗試將var onoffstate初始化爲一個字符串,然後在您的if條件塊中打印該var以查看它是否被修改。 –
移動evet監聽器中的if!或者將其封裝在一個函數中並從事件監聽器中調用該函數! –
@ibrahimmahrir,這使它的工作,謝謝。我無法相信我忽視了這麼簡單的事情。 –