Question

我一直在研究一个简单的Chrome扩展程序/用户脚本，我的工作完全正常。但是，我决定尝试添加选项页面以选择所需的选项。但是，我无法让它发挥作用......

这是我的options.html：

<html>
<head>
<title>Extension Options</title>
</head>

<select id="changeEmotes">
 <option value="twitch">Twitch</option>
 <option value="custom">Only Custom</option>
</select>

<button id="saveData">Save</button>

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

</body>
</html>

我的选项.js：

function saveData()
{   
var test = document.getElementById('changeEmotes').value;
chrome.storage.local.set({
    emoteSetting: test
}, function() {
    // Update status to let user know options were saved.
    var status = document.getElementById('status');
    status.textContent = 'Options saved.';
    setTimeout(function() {
    status.textContent = '';
    }, 750);
});

var emoteSetting = "";
chrome.storage.local.get("emoteSetting", function(result) {
    emoteSetting = result.emoteSetting;
    alert(result.emoteSetting);
});

}

document.getElementById('saveData').addEventListener('click', saveData);

最后，我的script.js：

// ==UserScript==
// @name Hitbox Emotes
// @namespace Hitbox Emotes
// @description Allows the use of Twitch emotes on Hitbox.
// @include *.hitbox.tv/*
// @include *.speedrun.tv/*
// @include *.twitch.tv/*
// @icon http://i.imgur.com/fa1Kkku.png
// @version 1.1.8
// @updateURL https://gist.githubusercontent.com/GamingTom/11141717/raw/465792.user.js
// @downloadURL https://gist.githubusercontent.com/GamingTom/11141717/raw/465792.user.js
// ==/UserScript==

function hitbox_twitch()
{
    var script = document.createElement('script');
    script.type = 'text/javascript';
    script.src = "https://gist.githubusercontent.com/GamingTom/11142192/raw/emotes.js";
    var head = document.getElementsByTagName('head')[0];
    if(head) head.appendChild(script);
}

function hitbox_custom()
{
var script = document.createElement('script');
script.type = 'text/javascript';
script.src = "www.test.com";
var head = document.getElementsByTagName('head')[0];
if(head) head.appendChild(script);
}

function update()
{
    var emoteSetting = "";
chrome.storage.local.get("emoteSetting", function(result) {
    emoteSetting = result.emoteSetting;
    console.log(result.emoteSetting);
            alert(result.emoteSetting);
});

}

update();

我的script.js通常在网站加载时运行，如果我执行类似“hitbox_twitch（）;”的操作最后而不是“update（）;”当我点击options.html上的保存按钮时，它确实提醒我正在寻找的正确变量。但是，当站点加载时不会出现警告框，并且我在控制台中发布了“未捕获的TypeError：无法读取未定义的属性'同步'”。总而言之，代码适用于options.html，但不适用于script.js。

如果有人有任何想法，我们将不胜感激，如果您需要更多信息，请随便询问。非常感谢。

- 汤姆

编辑：我的清单文件：

{
   "content_scripts": [ {
      "js": [ "contentscript.js" ],
      "matches": [ "*://*.hitbox.tv/*" ]
   } ],
   "description": "Allows the use of Twitch emotes on Hitbox.",
   "options_page": "options.html",
   "icons": {
      "128": "icon128.png"
   },
   "manifest_version": 2,
   "name": "Hitbox Emotes",
   "update_url": "https://clients2.google.com/service/update2/crx",
   "version": "1.1.8",
   "web_accessible_resources": [ "script.js" ],
   "permissions": ["storage"]
}

Chrome扩展程序选项页面

0 个答案: