Chrome拡張機能、フォームの保存エラー

私は、ポップアップで選択されたラジオ・オプションを保存しようとしたが、時にポップアップオープン、コンソールにエラーがあるのです：関連Chrome拡張機能、フォームの保存エラー

Uncaught Error: Invocation of form get(string, undefined) doesn't match definition get(optional string or array or object keys, function callback) extensions::schemaUtils::113

manifest.jsonを（）：

{ 
"content_security_policy": "script-src 'self' 'unsafe-eval'; object-src 'self'", 

"page_action": { 
     "default_icon": { 
     "19": "images/icon19.png", 
     "38": "images/icon38.png" 
     }, 
     "default_title": "Scratch theme loader", 
     "default_popup": "popup.html" 
    }, 

"content_scripts": [ 
    { 
    "matches": [ 
     "https://scratch.mit.edu/*" 
    ], 
    "js": ["jquery-2.2.2.min.js", "content.js"], 
    "run_at":"document_start" 
    } 
], 

"permissions": [ 
    "tabs", 
    "storage", 
    "declarativeContent", 
    "https://scratch.mit.edu/*", 
    "https://pastebin.com/raw/*" 
] 
}

popup.html：

<!DOCTYPE html> 
<html> 
    <head> 
    </head> 
    <body> 
     <ul id="main"> 
     <li id="top_bar"> 
      <img src = "images/S_Themes.png"> 
     </li> 
     <li> 
      <p>Choose which theme you would like to use:</p> 
      <form id="options" action=""> 
       <input type="radio" name="op" id="op1"> <div id="op1">Example 1</div> 
       <br><input type="radio" name="op" id="op2"> <div id="op2">Example 2</div> 
       <br><input type="radio" name="op" id="op3"> <div id="op3">Example 3</div> 
       <br><input type="radio" name="op" id="op4"> <div id="op2">Example 4</div> 
       <br><input type="radio" name="op" id="op5"> <div id="op3">Example 5</div> 
      </form> 
      <button type="button" id="save">Save</button> 
     </li> 
     <li> 
      <a href="#"><div class="options"><br>Add themes</div></a> 
      <a href="#"><div class="options">Options</div></a> 
     </li> 
    </ul> 
    <script type="text/javascript" src="popup.js"></script> 
    </body> 
</html>

popup.js：

function getValue(callback) { chrome.storage.sync.get("selected", callback); } 
var selectedvar = getValue() 
console.log("Data was loaded."); 

if ((typeof selectedvar) == "number"){ 
    var element = document.getElementById("op" + selectedvar.toString()); 
    console.log("op" + selectedvar.toString()); 
    element.checked = true; 
} 

document.getElementById('save').onclick = save; 

function save() { 
    var radios = document.getElementsByName("op"); 
    var value; 

    for(var k=0;k<radios.length;k++) 
      if(radios[k].checked){ 
      value = k + 1; 
      } 

    chrome.storage.sync.set({"selected": value}, function() { 
     console.log("Data was saved."); 
    }) 
}

PS。 jQueryを "popup.js"で動作させることはできませんので、可能であれば、それを使用しないでください。

EDIT：イバンNokonoko @、私はpopup.jsに以下のコードを変更しましたが、それが保存されていない、それがロードするときに、変数「selectedvar」は、まだ定義されていない

。

function call() {console.log("Data was loaded.");} 

function getValue(callback) { chrome.storage.sync.get("selected", callback); } 
var selectedvar = getValue(call); 

console.log(selectedvar); //prints undefined, despite being previously saved.

出典

2016-04-16 Melkor

あなたは第二引数としてのgetValueの引数でchrome.storage.sync.getを呼び出したが、その後、あなたは、引数なしでのgetValueを呼び出す：

VAR selectedVar =のgetValue（）< ---引数なし！

行うには、あなたのコードが発生します。エラーだ

chrome.storage.sync.get（ "選択"、未定義）

。 chrome.storageは非同期で動作するため、データを取得するコールバック関数を用意する必要があります。たとえば：

chrome.storage.sync.get("selected", function (data) { 
    if (data["selected"]) selectedVar = data["selected"] //better with dot notation 
    // then do stuff with selectedVar... 
    // ... 
});

これで試してみるがpopup.js：

function myCallbackFunction(dataStored) { 
    if (dataStored["selected"]) { //better with dot notation: dataStored.selected 
    selectedvar = dataStored["selected"]; 
    console.log("Data was loaded."); 
    } 
    if (selectedvar) { 
    var element = document.getElementById("op"+selectedvar); //JS automatically transforms number to String 
    console.log("op"+selectedvar); 
    element.checked = true; 
    } 
} 

function getValue(callback) { chrome.storage.sync.get("selected", callback); } 
getValue(myCallbackFunction); 

document.getElementById('save').onclick = save; 

function save() { 
    var radios = document.getElementsByName("op"); 
    var value; 

    for(var k=0;k<radios.length;k++) 
      if(radios[k].checked){ 
      value = k + 1; 
      break; // once you get the checked value, you can exit the loop. 
      } 

    chrome.storage.sync.set({"selected": value}, function() { 
     console.log("Data was saved."); 
    }); 
}

また、HTMLファイル内のdivのからidを変更/削除する必要があります（これらは入力のidのと競合する）

出典

2016-04-16 14:08:25

これでエラーは停止しましたが、まだ動作していません。質問を編集しました。 – Melkor

@Marchillこの時点で、答えはhttp://stackoverflow.com/questions/14220321/how-do-i-return-the-response-from-an-asynchronous-callにあります – Xan

ありがとう！これは完全に機能しました！ – Melkor

Chrome拡張機能、フォームの保存エラー

答えて

関連する問題