Question

我正在进行一项简单的练习，其中用户提交表单，表单中的信息显示在某些p标签中。当我单击提交按钮时，用户输入会在消失之前短暂地（在p标签中）闪烁到屏幕上。如何在输入框中输入用户输入的内容，以便在提交表单后保留在p标签中？

这是HTML。

  </head>

  <body>
    <h1>Enter A Force User</h1>
    <form name="force-user-form" id="force-user-form">
      <label>Name:</label>
      <input type="text" value="name" name="name" id="force-user-name">
      <label>Dark or Light</label>
      <input type="text" value="side" name="side" id="force-user-side">
      <input type="button" value="Enter Force User" id="force-user-submit" onclick="newForceUser()">
    </form>

    <p id="name-display" >*</p>
    <p id="side-display" >*</p>

    <script src="force-user-form.js"></script>
  </body>
</html>

这是JavaScript（console.log返回我在提交框中键入的任何值）

"use strict";

var $ = function(id){
  return document.getElementById(id);
}

var newForceUser = function(){

  var forceUserName = $("force-user-name").value;
  var forceUserSide = $("force-user-side").value;
  var isValid = true;

  $("name-display").firstChild.nodeValue = forceUserName;
  $("side-display").firstChild.nodeValue = forceUserSide;

  $("force-user-form").submit()

  console.log(forceUserName);

};

window.onload = function(){
  $("force-user-submit").onclick = newForceUser;
  $("force-user-name").focus();
};

表单提交后JavaScript不会在页面上保留

0 个答案: