Question

我有一个包含33个textarea的页面，如果用户填充其中的任何一个，我都想存储它们，但还要在localStorage的列表/数组中保留空白，这意味着，如果您仅使用条目0和条目33 ，中间的31个将是空的，因为它们的位置很重要。我取得了一些进步，而我所能获得的最好成绩就是这个脚本：

var cells = 33;

function savePlanner() {
    for (i = 0; i < cells; i++) {
        localStorage.setItem('planner', document.getElementsByTagName('textarea')[i]);
    }
}

在savePlanner文件中的按钮标签的onclick上调用HTML函数。

<div class="content-output"><textarea></textarea></div>
        <table class="u-full-width">
        <thead>
            <tr>
                <th>Hour</th>
                <th>Activity</th>
                <th>Note</th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td><textarea id="hour" class="user-input"></textarea></td>
                <td><textarea class="user-input"></textarea></td>
                <td><textarea class="user-input"></textarea></td>
            </tr>
            <tr>
                <td><textarea id="hour" class="user-input"></textarea></td>
                <td><textarea class="user-input"></textarea></td>
                <td><textarea class="user-input"></textarea></td>
            </tr>
            <tr>
                <td><textarea id="hour" class="user-input"></textarea></td>
                <td><textarea class="user-input"></textarea></td>
                <td><textarea class="user-input"></textarea></td>
            </tr>

这些textarea重复11次，并且由于其中有3列，因此我有33个条目。

但是，如果我使用document.getElementsByTagName('textarea')[i]，则存储的内容是HTMLTextAreaElement，如果我将value连接到它，即使我的某些{{ 1}}已满。我在这里想念什么？

Answer 1

localStorage.setItem('planner', document.getElementsByTagName('textarea')[i]);

正在将HTMLTextAreaElement粘贴到存储中，而localStorge只能存储字符串，HTMLTextAreaElement上的getString方法将返回HTMLTextAreaElement。

你想要

document.getElementsByTagName('textarea')[i].value

这是文本区域的值，而不是DOM元素。

localStorage存储HTMLTextAreaElement而不是值

1 个答案: