將HTML表單中的數據保存爲XML或CSV

Question

需要您提供有關如何在以下情況下繼續進行的建議。我有一個很長的HTML表單，專爲離線用戶完成。由於表單很長（而不是電子清單），我需要爲用戶提供保存和重新打開數據的功能，以便進一步完成表單。這一切都是離線發生的，所以我想只有javascript？ 目標格式，可能是XML或CSV？在這兩種選擇中，我將不得不面對什麼困難？任何偏好，爲什麼？ 很抱歉，如果這是不符合的質疑＃1政策））））

形式的樣品低於，如果它可以幫助行：

<div id="Q403"> 
     <table class="QTable"> 
      <tr> 
       <td width="45" align="left" valign="top" scope="row"><div class="QNumber">4.3</div></td> 
       <td width="100%" align="left" valign="top"> 
       <div class="QText"Question</div> 
       </td> 
      </tr> 
     </table> 
     </div> 

     <div> 
     <table class="RTable"> 
      <tr> 
      <td width="100%" align="left" valign="top" style="padding-right:20px"> 
     <div class="Guidance"> 
      <p>Various Content</p> 
     </div> 
      </td> 

      <td width="550" align="left" valign="baseline"> 
      <div class="Response"> 
       <label><input type="radio" name="Radio403" value="Y" id="Radio_403Y" onchange='radioChange(this, "403")'>Yes</label> 
       <label><input type="radio" name="Radio403" value="N" id="Radio_403N" onChange='radioChange(this, "403")'>No</label> 
       <label><input type="radio" name="Radio403" value="NS" id="Radio_403NS" onChange='radioChange(this, "403")'>Not Seen</label> 
       <label><input type="radio" name="Radio403" value="NA" id="Radio_403NA" onChange='radioChange(this, "403")'>Not Applicable</label> 
      </div> 
      <div class="responseDetails"> 
       <div class="Observation"> 
        <label for="Obs403">Observation:</label> 
        <textarea name="observation" id="Obs403" rows="6" disabled style="width: 530px;"></textarea> 
       </div> 
       <div> 
        <label for="DueDate">Due date:<br></label> 
       <input name="DueDate" class="DueDate" type="date" id="DueDate403"/> 
       </div> 

       <div class="actions"> 
        <label for="pa403">Actions required to correct and/or prevent this observation:</label> 
        <textarea name="actions" id="pa403" rows="6" style="width: 530px;"></textarea> 
       </div> 
       </div> 
      </td> 
      </tr> 
     </table> 
     </div> 

我相信一些你們的已經做了類似的東西，希望））））））））！）012）

Answer 1

要開始，你可以使用「的innerHTML」和「localStorage的」 JavaScript函數：您的瀏覽器-DB內永久存儲

這將讓你的內容（可達數兆字節）。

獲取容器元素：

var content = document.getElementById("YourContainerID");

節省：

localStorage["YourFormID"] = content.innerHTML;

負載：

content.innerHTML = localStorage["YourFormID"];

---

至從文件中讀取，您可以使用新的實驗HTML5文件API（只讀）。

http://www.w3.org/TR/FileAPI/

要寫入到文件，你有沒有直接的選擇呢，除了一個瀏覽器插件，如「Adobe Flash版本」，在這裏你也可以寫文件。或者，您可以（通過JavaScript）打開一個新窗口，然後將XML/CSV寫入它並要求用戶手動將新窗口內容另存爲文件，方法是詢問用戶按「Ctrl + S」。