DOM javascript 访问表单元素

Question

我已经开始javascript DOM操作，我可能遇到了一个错误。每当我在名称字段中输入 jaykumar 并按 click me 按钮时。在 demo, jaykumar 几微秒后就来了。

function myfunction() {
  var x = document.getElementById("myform").elements["fname"].value;
  document.getElementById("demo").innerHTML = x;
}

<form id="myform">
  name<input type="textbox" name="fname"> email
  <input type="textbox" name="email">
  <button onclick="myfunction()"> Click me</button>

</form>
<div id="demo"></div>

Answer 1

表单默认行为中的按钮是提交表单。要更改此设置，请制作 type="button"

的按钮

function myfunction() {
  var x = document.getElementById("myform").elements["fname"].value;
  document.getElementById("demo").innerHTML = x;
}

<form id="myform">
  name<input type="textbox" name="fname"> email
  <input type="textbox" name="email">
  <button type="button" onclick="myfunction()"> Click me</button>

</form>
<div id="demo"></div>

DOM javascript 访问表单元素

DOM javascript Form elements accessing

javascript

forms

dom

getelementbyid