2013-02-26 136 views
0
<html> 
<head> 
<title></title> 
<style type="text/css"> 
    body 
    { 
     font-family: tahoma; 
    } 
    h2 
    { 
     font-weight: bold; 
     border-bottom: 2px solid gray; 
     margin-bottom: 10px; 
    } 
    #data 
    { 
     border: 1px solid grey; 
    } 
</style> 
<script src="Scripts/jquery-1.4.1.js" type="text/javascript"></script> 
<script src="Scripts/jquery-1.4.1.min.js" type="text/javascript"></script> 
</head> 
<body> 
<script type="text/javascript">  
    var prefix = "HTML5LocalStorage-"; 
    $("#save").click(function() { 
     var key = $("#key").attr('value'); 
     var value = $("#value").attr('value'); 
     localStorage.setItem(prefix + key, value);   
     RewriteFromStorage(); 
    }); 

    function RewriteFromStorage() { 
     $("#data").empty(); 
     for (var i = 0; i < localStorage.length; i++) 
     { 
      var key = localStorage.key(i); 
      if (key.indexOf(prefix) == 0) { 
       var value = localStorage.getItem(key);     
       var shortkey = key.replace(prefix, ""); 
       $("#data").append(
      $("<div class='kvp'>").html(shortkey + "=" + value) 
       .append($("<input type='button' value='Delete'>") 
         .attr('key', key) 
         .click(function() { 
          localStorage.removeItem($(this).attr('key')); 
          RewriteFromStorage(); 
         }) 
        ) 
     ); 
      } 
     } 
    } 

    RewriteFromStorage(); 
</script> 
<h2> 
    LocalStorage Demo</h2> 
<div id="data"> 
</div> 
<hr /> 
<span>Key</span><input type="text" id="key" /><span>Value</span><input type="text" 
    id="value" /> 
<input type="button" id="save" value="Save" /> 

我已經寫在上面localstorage.htm頁(Visual Studio 2010中)的代碼行,但輸出什麼按鈕click.What錯誤,我有done.I這項技術是新的。HTML5數據不是在本地存儲中存儲

+0

我已經引用此鏈接http://jsfiddle.net/Benjol/HMEVd/ – 2013-02-26 11:47:52

+0

我不確定這是否相關,但在IE中'localStorage'在本地頁面上不起作用。 – Teemu 2013-02-26 11:48:17

+0

可能與您的問題沒有關係,但是這個 - .attr('value')' - 是完全錯誤的。當前的'value'是一個屬性,而不是一個屬性,並且有一個內置的jQuery函數專門用於獲取/設置它應該使用的'.val()'。 – 2013-02-26 11:49:41

回答

0

你的問題就在這裏:

var key = $("#key").attr('value'); 
    var value = $("#value").attr('value'); 

添加以下,看問題:

alert(key + ' ' + value); 

使用val INSEAD獲得的輸入值...

var key = $("#key").val(); 

您可以see this working in my JSFiddle

+0

你有沒有js小提琴的嘗試。你有wriiten腳本標記(在頭部或身體內).. – 2013-02-26 12:04:54

+0

該腳本在'onload'事件上執行 - 所以你可以把它放在任何你喜歡的地方,只要你還附加它'onload'事件。我通常會在''標籤前放置腳本。 – Fenton 2013-02-26 13:02:29