如何創建localStorage方法

我對localStorage對象有點困惑。 localStorage是一個對象，顯然意味着我們可以創建方法，創建屬性和類似普通對象。如何創建localStorage方法

我想弄清楚如何在localStorage內部創建一個方法。這是我目前有：

localStorage = { 
firstname: function(){ 
     //get the firsname from the input and set it as the localstorage firsname 
     $("#sublog").bind("click", function(){ 
     $("input[name='fName']").val(); 
     }); 
    }, 
    lastname: function(){ 
     //get the lastname from the input and set it as the localStorage lastname 
     $("#sublog").bind("click", function(){ 
     $("input[name='lName']").val(); 
     }); 
    } 
};

我的HTML看起來像這樣：

<div id="log"> 
    <form> 
     <input type="text" id="fName" name="fName" placeholder="FirstName" /> 
     <input type="text" id="lName" name="lName" placeholder="LastName" /> 
     <input type="submit" id="sublog" name="login" value="Login" /> 
    </form>

要清楚，我只是想給客戶的名字存儲到localStorage.firstname和localStorage.lastname當客戶將他名字和姓氏來保存它們。

來源

2013-06-27 Boaz Hoch

不幸的是，它不工作的方式。 localStorage對象不是您可以修改以保存值的任意對象 - 相反，您必須使用getItem或setItem方法來存儲數據。

例如，下面是經編輯的版本的代碼做你想要什麼：

function bind_handlers() { 
    $("#sublog").bind("click", function(){ 
     var firstname = $("input[name='fName']").val(); 
     var lastname = $("input[name='lName']").val(); 

     localStorage.setItem('firstname', firstname); 
     localstorage.setItem('lastname', lastname); 
    }); 
}

，並檢索這些值後，只需撥打localStorage.getItem('firstname')或localStorage.getItem('lastname')。

如果您想要保存數據結構，如{firstname : value, lastname : othervalue}，您首先必須將其轉換爲JSON。一個例子：

function bind_handlers() { 
    $("#sublog").bind("click", function(){ 
     var my_data = { 
      firstname: $("input[name='fName']").val(), 
      lastname: $("input[name='lName']").val() 
     } 

     localStorage.setItem('keyname', JSON.stringify(my_data)); 
    }); 
}

而對於檢索：

var my_data = JSON.parse(localStorage.getItem('keyname'));

來源

2013-06-27 13:29:40 Michael0x2a

它不會這樣工作。您必須爲您的對象在localStorage集合中分配一個鍵，並且它可以是功能，只有具有值的對象。您必須JSON.stringify才能解析對象，然後將其插入localStorage。請致電this article。

要設置一個對象爲localStorage，

//set that to localStorage 
localStorage["optArray"] = JSON.stringify(optArray);

要想從localStorage值，

var store = [undefined, null].indexOf(localStorage["optArray"]) != -1 ? [] : JSON.parse(localStorage["optArray"]);

在您的情況，您的點擊事件必須將其插入localStorage：

$("#sublog").bind("click", function() { 
    //set your names in an object 
    var name = { 
     "first": $("input[name='fName']").val(), 
     "last": $("input[name='lName']").val() 
    } 
    //parse it as a string and store it in localStorage 
    localStorage["name"] = JSON.stringify(name); 
    alert("Logged in!"); 
    //now refresh the page - you must see those values in the text box. 
});

然後，當頁面刷新時，您必須從localStorage獲得值並將其設置爲文本框。

//page refresh 
//check if value exists in localStorage 
if ([undefined, null].indexOf(localStorage["name"]) == -1) { 
    //exists 
    var name = JSON.parse(localStorage["name"]); 
    $("#fName").val(name["first"]); 
    $("#lName").val(name["last"]); 
}

演示：http://jsfiddle.net/hungerpain/hgAHs/

來源

2013-06-27 13:17:39 krishgopinath

好吧，我不能設置這樣的變量：var firstname =（input value）; var lastname =（輸入值），然後將其設置在localStorage中，如下所示：localStorage = {first：firstname，last：lsatname}; ？ –

@בועזהוך檢查更新的答案 – krishgopinath

爲什麼想要保存在localStorage的功能呢？

通過鍵值對將數據存儲在localStorage中。例如

localStorage.setItem('key','value');

，其中鍵和值是字符串。您可以通過使用

localStorage.getItem('key');

檢索使用您的數據或者您可以使用

localStorage.key = 'something'

和

var something = localStorage.key;

來源

2013-06-27 13:25:42 Johan

LocalStorage是指將數據存儲在客戶端，不與方法過載。你可以這樣使用它：

localStorage.foo = "bar"; 
console.log(localStorage.foo); 
>> bar

如果你需要存儲一個對象，你必須將它序列化爲一個字符串。

myobject = { 
    foo: 'bar' 
} 
localStorage.myobject = JSON.stringify(myobject);

而且拿回來這樣

myobject = JSON.parse(localStorage.myobject);

反正功能不能（也不應該）被存儲的方式。

來源

2013-06-27 13:31:50 thibauts

如何創建localStorage方法

回答

相關問題