如何检索html表单元素并在页面的其他位置显示值

Question

我没有经验，很抱歉，如果这是一个愚蠢的问题，但我环顾四周，我找不到适合我的答案。我正在使用JavaScript，我有一个带有一个文本输入的html表单。当有人输入该输入的值并提交表单时，我想返回到相同的HTML页面，但是他们输入的内容显示在页面的其他位置。这是我的表格：

<form name="chatInput" action="index.html"  method="get">
        chat:<input type="text" name="chat"/>
</form>

我看到有关于：

的事情

var chatText = document.forms[0].elements[0];

但是当我尝试使用它时，我得到[object HTMLInputElement]

此外，我只想创建该变量，如果表单已经输入一次但最初没有输入。我该如何检查？

感谢您的任何信息。

Answer 1

var chatText = document.forms[0]['chat'].value;

http://jsfiddle.net/XLeAn/

Answer 2

试试这个：

var chatText = document.forms[0].elements[0].value;

Answer 3

如果您不想重新更新html，我建议您不要使用表单标记。

相反，我会创建一个带有onclick属性的按钮。

<input type="button" value="Update" onclick="someFunction()">

然后在JS部分，有类似的东西。

var someFunction = function(){
    var chatText = document.getElementById("this-is-the-element-I-want").value;
}

当然，请确保您尝试从中检索信息的元素具有ID。

<input type="text" name="chat" id="this-is-the-element-I-want">

编辑：代码缩进和清晰度