Question

在我的网络表单上，我使用HTML5中的sessionStorage功能来存储表单中的值，然后将其显示在“感谢您”页面上，作为他们查询的确认收据。

我已设法存储除<textarea>元素以外的每种输入类型的值。

我试过了：

sessionStorage.setItem("Special", document.getElementsByName("specialInstructions").value);

但是这不会获得输入到文本区域的数据的值。

以下是排除<textarea>代码的<form>代码：

<textarea name="specialInstructions" rows="10" cols="50"></textarea>

以下是我用于其他表单元素的代码：

if (!rephonenumber.test(document.bookingsform.phonenumber.value)) {
        document.bookingsform.phonenumber.style.border = "1px solid red";
        document.getElementById("phonenumberwarn").innerHTML = "Invalid phone number.";
        document.bookingsform.phonenumber.title = "Please enter a phone number.";
        document.getElementById("phonenumberwarn").style.display = "block";
        valid = false;
    } else {
        document.bookingsform.phonenumber.style.border = "1px inset #EBE9ED";
        document.bookingsform.phonenumber.style.borderRadius = "2px";
        document.getElementById("phonenumberwarn").style.display = "none";
        sessionStorage.setItem("Phone Number", document.bookingsform.phonenumber.value);
    }

为什么这种语法不能用于文本区域？

Answer 1

通过此函数document.getElementsByName，您将获得匹配元素的数组。

因此，要访问数组的第一个元素并将其存储到localStorage中，您可以执行类似这样的操作。

sessionStorage.setItem("Special", document.getElementsByName("specialInstructions")[0].value);

您可以在此处获取有关getElementsByName

的更多信息

Answer 2

您必须指定您想要该值的确切元素，因为document.getElementsByName返回一个数组：

document.getElementsByName('name')[0]
document.getElementsByName('name')[1]
document.getElementsByName('name')[2]
...

你需要获得一个位置的值，试试：

document.getElementsByName('name')[0].value;

你可以使用id：

document.getElementById('name').value

Answer 3

对document.getElementsByName()的调用会返回元素列表，而不是单个元素。如果您只有一个<textarea>，则可以使用document.getElementsByName()[0].value。否则，你需要迭代它们。

JavaScript - sessionStorage如何存储文本区域值？

3 个答案: