0

我正在创建一个非常基本的表单，我需要在输入/文本区域上使用 HTML5 localStorage。

这是HTML：

<div id="local-storage">
    <input name="name" type="text" placeholder="Name:">
    <input name="website" type="url" placeholder="Website:">
    <textarea name="message" placeholder="Message:"></textarea>
</div>

到目前为止我的脚本：

(function () {
        var localStorageID = document.getElementById('local-storage');
        var inputTags = ['input', 'textarea', 'select', 'button'];

        for (var i = 0; i < inputTags.length; i++) {

            var localStorageTag = localStorageID.getElementsByTagName(inputTags[i]);
            var formData = {};
            for (var z = 0; z < localStorageTag.length; z++) {
                formData[localStorageTag[z].name] = localStorageTag[z].value;
            }
            localStorage.setItem('formData', formData);
            if (localStorage.getItem('formData')) {

            }

            for (var z = 0; z < localStorageTag.length; z++) {
                var currentLocalTag = localStorageTag[z];
                currentLocalTag.className += 'test';
                setInterval(function () {
                    localStorage.setItem('autosave', currentLocalTag.value);
                }, 1000);

                if (localStorage.getItem('autosave')) {
                    for (var i = 0; i < localStorageTag.length; i++) {
                        var currentLocalTags = localStorageTag[i];
                        currentLocalTags.value = localStorage.getItem('autosave');
                    }
                }
            }
        }
    })();

到目前为止我所做的是捕获数据，但我认为我在某个地方出错了，因为输入元素正在写入不正确的值。我对 JavaScript 相当陌生，所以这对我来说是一个巨大的学习曲线，并且非常感谢任何帮助。

到目前为止，这是表单的 JSFiddle，输入一些内容并等待几秒钟并刷新：http: //jsfiddle.net/ZJZNf

4

1 回答 1

0

localStorage只存储字符串。如果要存储（不太重）对象，则必须对它们进行序列化。

例如，您可以使用 JSON：

// store
localStorage.setItem('formData', JSON.stringify(formData));

// read
var str = localStorage.getItem('formData');
if (str) formData = JSON.parse(str);
于 2013-03-13T17:09:13.697 回答