Chrome扩展程序：如何在本地存储数据？

Question

我试图做非常基本的列表镶边扩展。 当我从textarea附加值时，它会显示在扩展名上，但是如果我关闭扩展名然后单击它，则附加值不存在。 我该如何储存？

 // chrome.tabs.getSelected(null, function(tab){ $("#button").click(function() { var userList = $('#textarea').val(); localStorage.setItem('userlist', 'userlist'); $('#textarea').val(''); $('#list').append('<p>' + localStorage.getItem('userlist', 'userlist')); }); // }); 

 #textarea { display: inline-block; min-width: 200px; resize: none; outline: none; } #button { border: none; color: #fff; background: #333; height: 24px; width: 50px; display: inline-block; vertical-align: 7px; } #list { border: 1px solid #333; } 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <textarea rows="1" id="textarea"></textarea> <button id="button">Add</button> <div id="list"></div> 

Answer 1

您是否尝试过localStorage ？

localStorage.setItem('myCat', 'Tom');

Answer 2

是。 答案是localStorage 。

基本上，您可以这样使用> localStorage.setItem（'myCat'，'Tom'）;

在下面，您可以看到我是如何使用它的。

 // just created a list variable where i append my values. // and then set the list to localStorage. // then just wrote if statement to check if we have something on local storage already saved. //all codes here // chrome.tabs.getSelected(null, function(tab){ $("#button").click(function() { var userList = $('#textarea').val(); $('#textarea').val(''); $('#list').append('<p>' + userList); var list = $("#list").html(); localStorage.setItem('list', list); return false; }); if (localStorage.getItem('list')) { $('#list').html(localStorage.getItem('list')); } // }); 

 #textarea { display: inline-block; min-width: 200px; resize: none; outline: none; } #button { border: none; color: #fff; background: #333; height: 24px; width: 50px; display: inline-block; vertical-align: 7px; } #list { border: 1px solid #333; } 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <textarea rows="1" id="textarea"></textarea> <button id="button">Add</button> <div id="list"></div>