HTML5和Javascript字符保存

我正在嘗試更新我的探路者字符生成器，以便能夠使用HTML5的Web存儲器保存字符。我有一個用於生成角色的JavaScript文件。HTML5和Javascript字符保存

但是，我遇到了一些問題。我怎樣才能做到這一點，只有點擊我的「更新字符」按鈕才能更新已更新的內容？其次，最好的展示結果的方法是什麼？

這是我當前的代碼：

function SaveCharacter() { 
    makeCharacter(); 
    if (typeof(Storage) !== "undefined") { 
     if (localStorage.used) { 
      alert("used was true."); 
      localStorage.name = name; 
     } 
     else { 
      localStorage.used = true; 
      localStorage.name = name; 
      localStorage.skill_points = num_skill_points; 
      localStorage.spells = num_spells; 
      localStorage.feats = num_feats; 
      localStorage.hitdie = hit_die; 
      localStorage.wealth = wealth; 
      localStorage.Class = Class; 
     // localStorage.Scores = new Array(); 
     // for (var i = 0; i < n; i++) { 
     //   localStorage.Scores[i] = ability_scores[i]; 
     //   } 
      } 
      document.getElementById("result").innerHTML="Character Name: " + localStorage.name; 
     } 
     else { 
      document.getElementById("result").innerHTML = "Sorry, your browser does not support web storage..."; 
    } 
} 

function DeleteCharacter() { 
     localStorage.clear(); 
}

這一工作時，它改變了名稱，無論是否我已經刪除的字符或沒有。此外，document.getElementById("result").innerHTML="Character Name: " + localStorage.name;不允許我一次更新多個字段。什麼是更好的方法來做到這一點？

[編輯] - Here is a link to the generator。

來源

2012-04-24 Linell

一是一些想法你都幹了些什麼：

我建議你使用的Modernizr庫而不是typeof(Storage) !== "undefined"知道是否支持localStorage的。它將更加強大。
而不是處理一堆變量，你應該創建一個類似於Character對象的東西，它將使用JSON.stringify()保存到localStorage中，並使用JSON.parse()進行檢索。它也會使你的代碼更具可讀性。
不要使用像'Class'這樣的變量名，它太容易出錯。改用'category'或'type'之類的東西。

當我看着你的頁面時，我有這個錯誤：'表單沒有定義'。所以你的makeCharacter（）函數不起作用。

關於顯示結果的問題，您可以在'result'div中生成更多信息。你不限於一個文本。
我認爲更好的選擇是設置'result'元素，以便您可以輕鬆顯示數據。例如：

<table id="result"> 
    <tr> 
    <td>Name :</td> 
    <td id="name"></td> 
    </tr> 
    ... Other characteristics 
</table>

這樣你就可以做一些簡單的像document.getElementById('name') = character.name 當然是生成的字符之前該表將被隱藏（使用「顯示」 CSS屬性）

來源

2012-04-24 07:33:32

HTML5和Javascript字符保存

回答

相關問題