2017-02-09 6 views
1

У меня есть этот кусок кода (спасибо Shah Abax Khan), и я хотел сделать его расширением Chrome. Я написал страницу настроек/параметров, но фактически не сохраняет настройки. Помогите?Настройки расширения 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> 

яй() предполагается сохранить настройки, но это не так.

+1

Вы можете использовать HTML5 LocalStorage, если вы действительно хотите, но не встроенные JS, как обработчик OnClick. Всегда смотрите консоль devtools, когда что-то не работает: вы увидите там ошибку. – wOxxOm

ответ

0

В Chrome Extension вы не должны использовать 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 
    }) 
} 
+0

Ошибка в строке, где указано «chrome.storage.sync.get (функция (данные)». «Я никогда не пользовался Chrome Storage. –