Question

我正在尝试将其设为“document.write”，但它没有出现。我正在使用Dreamweaver。

<!DOCTYPE html> 
<html> 
<head> 
<title>Untitled Document</title> 
<script> 
  x=0;
  function newPerson(){
    x++;
    document.write(x);
    var pname = "p" + x;
    var jj =document.forms["frm1"]["fname"].value;
    var gg =document.forms["frm1"]["lname"].value;
    document.write(pname + jj + gg);
  }

</script>
</head>
<body>
  <form name="frm1" onSubmit="newPerson()">

  First Name: <input type="text" id="fname" name="fname"/> <br/>
  Last Name: <input type="text" id="lname" name="lname"/><br/>
  <input type="submit" value="update"/>  </form>

</body> 
</html>

Answer 1

现在可以使用

<强> HTML：

<form method="post" name="frm1" onsubmit="return newPerson()"> <!-- return -->
    First Name: <input type="text" id="fname" name="fname"/> <br/>
    Last Name: <input type="text" id="lname" name="lname"/><br/>
    <input type="submit" value="update"/>
</form>

<强> JS：

var x = 0;
function newPerson(){
    var form = document.frm1; // or : document.forms[0]; for first form
    x++;
    var pname = "p" + x;
    var jj = form.elements["fname"].value;
    var gg = form.elements["lname"].value;
    document.write(x);
    document.write(pname + jj + gg);
    return false; // <-- stops submission
}

DEMO.

Answer 2

您的代码存在一些问题：

由于默认submit操作，表单已提交。您必须通过将return false;添加到JavaScript函数并return newPerson();添加到表单的onSubmit属性来防止这种情况发生。
您的document.write(x)行覆盖了该页面，这意味着最初出现的所有元素（包括fname和lname）都将丢失，因此无法访问。删除此行。
还要document.write代替outputDiv并将输出写入其中。一般来说，document.write被认为是不好的做法，因为它重新绘制了整个页面。

纠正上述所有问题，您的代码应如下所示。

<强> HTML：

<form name="frm1" onSubmit="return newPerson();">First Name:
    <input type="text" id="fname" name="fname" />
    <br/>Last Name:
    <input type="text" id="lname" name="lname" />
    <br/>
    <input type="submit" value="update" />
</form>
<div id='outputDiv'></div>

<强> JS：

  x = 0;
  function newPerson() {
      x++;
      console.log(x); //just to see what is the value of x in console. not needed otherwise
      var pname = "p" + x;
      var jj = document.frm1.fname.value;
      var gg = document.frm1.lname.value;
      document.getElementById('outputDiv').innerHTML = pname + jj + gg; //set the computed value to the outputDiv.
      return false;
  }

Working Demo

Answer 3

对您的代码进行以下更改。它运作得很好：

<script> 
  var x=0;
  function newPerson(){
    x++;
    document.write(x);
    var pname = "p" + x;
    var jj = document.getElementById('fname').value;
    var gg =document.getElementById('lname').value;
    document.write(pname + jj + gg);
  }
</script>

document.write(x);有什么需要？您可以轻松使用alert(x);。还有一件事，这个代码背后的目的并不清楚。请确保将来提供详细的问题。

Answer 4

TRY THIS to check what's happening:-
<!DOCTYPE html> 
<html> 
<head> 
<title>Untitled Document</title> 
<script> 
x=0;
function newPerson(){
x++;
document.write(x);
  // var pname = "p" + x;
  // var jj =document.forms["frm1"]["fname"].value;
  // var gg =document.forms["frm1"]["lname"].value;
  // document.write(pname + jj + gg); 
return false;
}

</script> </head>

<body>

<form name="frm1" onSubmit="return newPerson()">

First Name: <input type="text" id="fname" name="fname"/> <br/>
Last Name: <input type="text" id="lname" name="lname"/><br/>
<input type="submit" value="update"/>  </form>

</body> </html>

Explanation:- As you submit you form. it calls to your function. document.write executes.
and document.write  will clear document area and will write there value of x.
now when code goes to second line there is no form so there is no value .

所以这会给javascript错误。并遵循以下几点： -

*onsubmit is used with return , means return true then submit form else not. but in your code form will be submitted in any case.

* As form submit to default action, means self page. page will reload. 
you can check what's happening, by putting breakpoints in firebug, or debug console in any modern browser. and please enable persist log upon navigation.

所以你会发现那里发生的事情。

document.write不起作用

4 个答案: