2013-06-01 271 views
0

我想讓2個按鈕工作。一個應該保存我的本地存儲,另一個應該讀取我的本地存儲。由於某些原因,他們仍然無法正常工作。我確實有警報工作,但現在不起作用。爲了閱讀本地存儲,我想使用jQuery append()方法。對我失蹤的任何想法。html按鈕不起作用

腳本

$(document).ready(function() { 


    function saveLocal(){ 
if (window.localStorage) { 
    localStorage.setItem("firstname","myfirstname"); 
    localStorage.setItem("lastname","mylastname"); 
    localStorage.setItem("state","mystate"); 
    alert("The data has been saved locally."); 
} else { 
    alert("Your Browser does not support LocalStorage."); 
} 
      } 

    function readLocal(){ 
if (window.localStorage) { 
    var firstname = localStorage.getItem("myfirstname"); 
    var lastname = localStorage.getItem("mylastname"); 
    var coursetitle = localStorage.getItem("mystate"); 

    $("#message").empty().append(firstname + " " + lastname + " " + state     ); 
}else { 
    alert("Your Browser does not support LocalStorage."); 
} 
     } 


     }); // end ready 

HTML

 </div> 
     </p> 
     <p> 

    <div id="main"> 
<input type="button" value="Save Values" onclick="saveLocal()"/> 
<input type="button" value="Read Values" onclick="readLocal()"/> 
     </div> 

回答

6

不定義$(document).ready()處理程序中的功能。名稱只能在該函數的作用域內訪問,所以它們不能用於在全局範圍內查找名稱的內聯處理程序。

應該在這個處理程序中的唯一的東西是在文檔加載後需要進行的直接操作。函數定義不需要像那樣延遲。

或者,而不是使用的HTML onclick屬性,你可以使用jQuery綁定:

$("#savebutton").click(savelocal); 
$("#readbutton").click(readlocal); 
+0

定義'$(document).ready()'裏面的函數並沒有什麼錯誤,在你建議的'.click()'綁定的旁邊 – Ian

+2

沒有錯與它,但它不是必要的。它可能會導致這樣的問題。 – Barmar

+0

如果您正確地綁定事件(如您的建議),則問題也不會發生。也許這只是我,但我喜歡儘量保持本地化,以免污染任何不相關的範圍 – Ian

2

取出文件準備好孤單它沒有必要。你不要求它運行任何東西。將腳本放在head標籤中並稱之爲一天