Chrome擴展程序設置頁面

我有這段代碼（感謝Shah Abax Khan），我想讓它成爲Chrome擴展程序。我寫了一個設置/選項頁面，但實際上並沒有保存設置。幫幫我？Chrome擴展程序設置頁面

的Javascript：

var pretty_fied = false; 
var isOn = localStorage.isOn; 
var isCapFirst = localStorage.isCapFirst; 
var firstLetterPerWord = localStorage.firstLetterPerWord; 



function yay() { 

    if ($("#on").value == "on") { 
     isOn = true; 
     localStorage["isOn"] = true; 
    } 
    else { 
     isOn = false; 
     localStorage["isOn"] = false; 
    } 


    if ($("#first").value == "on") { 
     isCapFirst = true; 
     localStorage["isCapFirst"] = true; 
    } 
    else { 
     isCapFirst = false; 
     localStorage["isCapFirst"] = false; 
    } 


    if ($("#per").value == "on") { 
     firstLetterPerWord = true; 
     localStorage["firstLetterPerWord"] = true; 
    } 
    else { 
     firstLetterPerWord = false; 
     localStorage["firstLetterPerWord"] = false; 
    } 


}; 



$('input, textarea').keyup(function() { 

    alert(isOn); 
    if (isOn) { 

     prev = true; 

     var value = $(this).val(); 
     var altText = ''; 
     for (num = 0; num < value.length; num++) { 
      if (num % 2 == 0) 
       altText += value[num].toUpperCase(); 
      else 
       altText += value[num].toLowerCase(); 
     } 
     $(this).val(altText); 
    } 


});

而這裏的HTML：

<!DOCTYPE html> 
<html> 
    <head> 
     <title>Y.A.Y | Options</title> 
     <script type="text/javascript" src="/js/caps.js"></script> 
    </head> 

    <body> 
     <h1>Settings</h1> 
     <form> 

      <label>Enabled: </label> 
      <select id="on"> 
       <option value="on">Yes</option> 
       <option value="off">No</option> 
      </select> 

      </br> 

      <label>First Letter:</label> 
      <select id="first"> 
       <option value="on">Capital</option> 
       <option value="off">Lowercase</option> 
      </select> 

      </br> 

      <label>Change First Letter of Each </label> 
      <select id="per"> 
       <option value="on">Word</option> 
       <option value="off">Sentence</option> 
      </select> 

      <button id="done" onclick="yay()">Save</button> 
     </form> 
    </body> 
</html>

耶（）應該保存設置，但事實並非如此。

來源

2017-02-09 Joseph Liu

您可以使用HTML5 localStorage的，如果你真的想，但不是內聯JS像onclick處理程序。有些東西無法正常工作時，請務必查看devtools控制檯：您會在那裏看到錯誤。 – wOxxOm

在Chrome擴展中，您不應使用LocalStorage。這是爲網站。

使用Chrome Storage，而不是像這樣：

的JavaScript：

var pretty_fied = false; 

var isOn; 
var isCapFirst; 
var firstLetterPerWord; 

getData() 

function getData() { 
    chrome.storage.sync.get(function (data) { 
     isOn = data.isOn; 
     isCapFirst = data.isCapFirst; 
     firstLetterPerWord = data.firstLetterPerWord; 
    }) 
} 

function yay() { 
    isOn = $("#on").value == "on"; 
    isCapFirst = $("#first").value == "on"; 
    firstLetterPerWord = $("#per").value == "on"; 

    chrome.storage.sync.set({ 
     isOn: isOn, 
     isCapFirst: isCapFirst, 
     firstLetterPerWord: firstLetterPerWord 
    }) 
}

來源

2017-02-09 07:59:31

有一個錯誤，它表示「chrome.storage.sync.get（function（data）{」。我從來沒有使用Chrome存儲。 –

Chrome擴展程序設置頁面

回答

相關問題