크롬 확장 프로그램 설정 페이지

이 코드는 (Shah Abax Khan에게 감사합니다.) Chrome 확장 프로그램으로 만들고 싶습니다. 설정/옵션 페이지를 작성했지만 실제로 설정을 저장하지는 않습니다. 도움?크롬 확장 프로그램 설정 페이지

자바 스크립트 : 여기

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 로컬 스토리지를 사용할 수 있지만 인라인 JS. 무언가가 작동하지 않을 때마다 devtools 콘솔을 항상보십시오. 오류가있을 것입니다. – wOxxOm

Chrome 확장 프로그램에서는 LocalStorage를 사용하지 않아야합니다. 웹 사이트 용입니다. 대신이 같은

사용 Chrome Storage :

자바 스크립트 다음의 onclick 핸들러와 같은

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 저장 공간을 사용한 적이 없습니까? –

크롬 확장 프로그램 설정 페이지

답변

관련 문제