Question

在以下情况中需要有关如何最佳处理的建议。我有一个很长的HTML表单，专为OFFLINE用户设计。由于表单很长（而不是电子清单），我需要为用户提供保存和重新打开数据的能力，以便进一步完成表单。这一切都是离线发生的，所以我想只有javascript？目标格式，可能是XML还是CSV？在任何一个选项中我都要面对哪些困难？任何偏好，为什么？很抱歉，如果这与提问的Stackoverflow政策不符））））

表单示例如下：如果有帮助：

<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>

我相信你们中的一些人一直在做类似的事情，希望））））

提前致谢）））！

Answer 1

要开始使用，您可以使用“innerHTML”和“localStorage”JavaScript函数：

这会将您的内容（最多几兆字节）保存在 Browser-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”

将HTML表单中的数据保存为XML或CSV

1 个答案: