Question

我无法在Javascript中将文本输出到div。当我按下按钮上的功能时，它会显示文本一小秒，然后消失。为什么会这样？代码如下：

代码：

function val(){
        var x = document.getElementById('us').value
        document.getElementById("demo").innerHTML = x;
}

HTML：

<form method="post">
   <p id="demo"></p>
   <br />
   <input type="text" id="us" name="username"></input>
   <br />           
   <button type="submit" onclick="val()">Sign Up</button>
</form>

Answer 1

<form method="post">
   <p id="demo"></p>
   <br />
   <input type="text" id="us" name="username"></input>
   <br />           
   <button type="button" id="asd">Sign Up</button>
</form>

$('#asd').click(function () {
    var x = document.getElementById('us').value
        document.getElementById("demo").innerHTML = x;

});

<强> FIDDLE

我做了一些改变。我将按钮类型从submit更改为button，同时我添加了id for the button。检查

Answer 2

试试这个：

您的代码按预期工作，但是当您将按钮类型设为submit时，我会提交表单。

function val() {
  var x = document.getElementById('us').value
  document.getElementById("demo").innerHTML = x;
}

<form method="post">
  <p id="demo"></p>
  <br />
  <input type="text" id="us" name="username"></input>
  <br />
  <button type="button" onclick="val()">Sign Up</button>
</form>

Javascript输出错误

2 个答案: