Javascript表单输入检索

Javascript Form Input Retrieval

本文关键字:检索 输入 表单 Javascript      更新时间:2023-09-26

为什么在包含文本框提交按钮的表单中,我可以提示用户在文本框中输入的内容,但不能在页面上打印?我做错了什么?

下面是代码

<form name="Serb" action="" method="get">
<input name="Name" type="text" size="15" maxlength="20" />
<input name="Join" type="submit" value="Join" onClick="serb(this.form)" />
<script type="text/javascript">
    function serb(form){
    var x = document.Serb.Name.value;   
    alert(x); ''this alerts
    document.write(x); ''this should print on page
    }
</script>

由于某种原因,警报工作正常,并准确地显示用户在按下'Join'后在用户名框中键入的内容。但是,它不会在页面上打印信息。为什么呢?

, 工作。文本框中的值将打印在页面上。

但是:

  1. ''在Javascript中没有任何意义。注释以//开头。这很可能是您没有看到写入

    的值的原因。
  2. document.write用它的参数替换HTML页面中的任何内容。(如果它在文档加载后被调用)。所以,除非你想学习Javascript,否则这不是一个很好的主意。

    实际上它不是一个很好的主意使用它,即使在学习Javascript,除非你试图学习document.write是如何工作的。有很多灵活的(更好的)方法来操作页面的内容,从简单的getElementById到复杂的DOM操作

在页面加载/解析后使用document.write()不是一个好主意。此时,它将用新内容覆盖页面HTML。Document.write()通常在加载页面时使用,用于在加载页面时在特定点插入内容。

如果你想把值放到页面上的一些项目中,那么你需要使用适当的DOM方法,把值放到输入字段中,在div上设置innerHTML,等等…

你可以阅读有关文档。写在这里:https://developer.mozilla.org/en/document.write.

下面是一个从字段中获取值并将其放入页面上的另一个对象的示例,而不使用document.write(): http://jsfiddle.net/jfriend00/dU8Sr/.

HTML:

<form name="Serb" action="" method="get">
<input name="Name" type="text" size="15" maxlength="20" />
<input name="Join" type="button" value="Join" onClick="serb(this.form)" />
</form>
<br>
<br>Output: <span id="output"></span>
Javascript:

function serb(form) {
    var x = document.Serb.Name.value;   
    document.getElementById("output").innerHTML = x;
}