-1
新しいクロムプラグインの[オプション]ページのchrome.storage.syncでチェックボックスのデータを安全にすることができません。私はこれを働かせるために多くの方法を試みました。これは私の最も最近のものです。私は完全に失われています。おかげで事前に：Chromeプラグイン保存チェックボックスに失敗するオプションのページ
$(document).ready(function() {
var storage = chrome.storage.sync;
function load_options() {
//Retrieve existing settings
$("input[type=checkbox]").each(function() {
$(this).prop('checked', function() {
var name = $(this).parent().next().html();
storage.get(name, function(items){
element.checked = items[name];
});
});
});
}
function saveSettings() {
var checkboxes = $("input[type=checkbox]");
var items = {};
checkboxes.each(function(){
var name = $(this).parent().next().html();
items[name] = this.checked;
});
storage.set(items, function() {
console.log("saved");
});
}
//Factory settings pages class, load dynamic html
function SettingsPageFactory(menuitem) {
this.settingsFactoryItems = {
Posts: 'settings/posts.html',
Sidebar: 'settings/sidebar.html',
General: 'settings/general.html',
Privacy: 'settings/privacy.html'
};
this.keys = [];
for (var key in this.settingsFactoryItems) {
this.keys.push(key);
}
this.createSettingsPage = function() {
var key = menuitem.find("a").html();
currentPage = key;
if ($.inArray(this.keys, key)) {
$("#page-content-wrapper").html("");
var url = chrome.runtime.getURL(this.settingsFactoryItems[key]);
return url;
}
}
}
$("#wrapper").on("click", "a#safeman.btn.btn-info", function() {
saveSettings();
});
$(".menuitem").on("click", function() {
var settingsPageFactory = new SettingsPageFactory($(this));
var url = settingsPageFactory.createSettingsPage();
$("#page-content-wrapper").load(url + " .container-fluid");
load_options();
return false;
});
希望の動作は、非同期に読み込まれる別のページの単なるオプションページです。これらはスイッチのような外観のチェックボックスを含んでいます。スイッチをオンまたはオフにするときは、上記のAPIを使用してこれを保存する必要があります。動的にロードされたページの例がここで発見された
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, shrink-to-fit=no, initial-scale=1">
<meta name="description" content="">
<meta name="author" content="">
<title>Faceblock - Settings Page</title>
<!-- Bootstrap Core CSS -->
<link href="css/bootstrap.min.css" rel="stylesheet">
<!-- Switch checkbox -->
<link href="css/switchbox.css" rel="stylesheet" />
<!-- Custom CSS -->
<link href="css/simple-sidebar.css" rel="stylesheet">
<link href="css/options.css" rel="stylesheet">
</head>
<body>
<div id="wrapper">
<!-- Sidebar -->
<div id="sidebar-wrapper">
<ul class="sidebar-nav">
<li class="sidebar-brand">
<a href="options.html" style="text-align:center;margin-left:-30px;">
Settings
</a>
</li>
<li class="menuitem">
<span class="glyphicon glyphicon-download-alt"></span><a href="posts">Posts</a>
</li>
<li class="menuitem">
<span class="glyphicon glyphicon-indent-right"></span>
<a href="sidebar">Sidebar</a>
</li>
<li class="menuitem"><span class="glyphicon glyphicon-eye-close"></span>
<a href="privacy">Privacy</a>
</li>
<li class="menuitem">
<span class="glyphicon glyphicon-check"></span>
<a href="general">General</a>
</li>
<li class="menuitem">
<span class="glyphicon glyphicon-eur"></span>
<a href="donate">Donate</a>
</li>
<li class="menuitem">
<span class="glyphicon glyphicon-cog"></span>
<a href="settings">Settings</a>
</li>
</ul>
</div>
<!-- /#sidebar-wrapper -->
<!-- Page Content -->
<div id="page-content-wrapper">
<div class="container-fluid">
<div class="row content">
<div class="col-lg-12">
<a href="#menu-toggle" class="btn btn-black" id="menu-toggle">Toggle Menu</a>
<h2>Faceblock Settings Page</h2>
<p>Faceblock is a Chrome extension which filters all annoying adds on Facebook. It also gives you control over which content you would like to show or hide, and makes sure your privacy is kept secret to big companies.</p>
<p>If you like our Chrome plugin, feel free to donate a small fee in order to keep future changes and features coming. <code>Choose a category from the right sidebar and start configuring Facebook according to your needs!</code></p>
</div>
</div>
</div>
</div>
<!-- /#page-content-wrapper -->
</div>
<div id="dependencies" />
<script src="js/jquery.min.js"></script>
<!-- Bootstrap Core JavaScript -->
<script src="js/bootstrap.min.js"></script>
<script src="js/background.js"></script>
<script src="js/options.js"></script>
</div>
<!-- /#wrapper -->
</body>
</html>
：動的ページは、すべてこのメインページに含まれている
<div class="container-fluid">
<div class="row content">
<div class="col-lg-12">
<a href="#menu-toggle" class="btn btn-black" id="menu-toggle">Toggle Menu</a>
<div class="container">
<div class="col-lg-1 col-centered">
</div>
<h2>privacy</h2>
</div>
<p>Facebook stores unwanted data in the form of cookies and other ways to show you unwanted data you might like.<code>At this page you can tell Facebook to not store your private information and to not sell it to its third-party apps.</code></p>
<div class="container">
<div class="col-lg-1 col-centered">
<label class="switch ">
<input type="checkbox" checked>
<div class="slider round"></div>
</label>
<div class="lable">Disable cookies Facebook</div>
</div>
</div>
</div>
</div>
</div>
私のmanifest.jsonを、次のようになります。
{
"name": "FaceBlock",
"description": "This extention gets rid of unwanted content on Facebook like sponsored posts, adds or annoying suggestions. The content you wish to see is enlarged for a better and richer social experience.",
"version": "0.0.1",
"manifest_version": 2,
"content_scripts": [
{
"matches": [
"http://*.facebook.com/*", "https://*.facebook.com/*", "<all_urls>"],
"css": ["css/popup.css"],
"js": ["js/jquery.min.js", "js/content.js",
"js/options.js",
"js/background.js"],
"run_at": "document_end",
"all_frames": true
}],
"options_page": "options.html",
"browser_action": {
"default_icon": "icon.png",
"default_popup": "popup.html",
"default_title": "Faceblock"
},
"permissions": [
"activeTab",
"tabs",
"https://www.facebook.com/*",
"https://ajax.googleapis.com/",
"storage",
"<all_urls>"
],
"background": {
"scripts": ["js/background.js", "js/options.js"],
"persistent": true
},
"options_ui": {
// Required.
"page": "options.html",
// Recommended.
"chrome_style": true
// Not recommended; only provided for backwards compatibility,
// and will be unsupported in a future version of Chrome (TBD).
//"open_in_tab": true
},
"web_accessible_resources": [
"images/faceblock.jpg",
"images/seigaiha.png",
"js/popup.js",
"icon.png",
"js/options.js",
"css/popup.css",
"popup.html",
"options.html",
"background.html",
"js/background.js"
]
}
としては、問題が永続データの保存と検索に嘘をついた
（http://stackoverflow.com/a/38920982/3773011）あなたの拡張機能をロードして実行すると？ – Makyen
質問をon-topicにするには、** complete ** [mcve]を含めて*問題を再現してください*。 * manifest.json *、背景/コンテンツ/ポップアップスクリプト/ HTMLの一部を含みます。デバッグの助けを求める質問（「**なぜこのコードは動作しないのですか？**」）には、以下が含まれていなければなりません：►必要な動作、►特定の問題またはエラー*、および►問題を再現するのに必要な最短コード自体**。明確な問題文がない質問は、他の読者にとって有用ではありません。参照してください： "**どのように[mcve] **を作成するか"、[ここで私はどんな話題を聞くことができますか？]（http://stackoverflow.com/help/on-topic）、[ask] – Makyen
いいえ、それを行います –