Question

我无法获取我的值以转到另一个html页面。我验证了字段，并在字段填充后单击“保存”，数据不会转到新的html。

在新的html中，仅显示“欢迎”。

这是我们输入名称的第一个HTML

function parse() {
  var n = document.getElementById("nam").value;
  localStorage.setItem("textvalue", n);
  return false;

}

function validations(form) {
  function trimfield(str) {
    return str.replace(/^\s+|\s+$/g, '');
  }

  var errors = [];
  var n = document.getElementById("nam").value;
  if (n == "") {
    errors.push("Enter Name \n");
  }

  if (errors.length > 0) {
    var msg = "Errors : \n\n";
    for (var i = 0; i < errors.length; i++) {
      msg = msg + errors[i];
    }
    alert(msg);
    return false;
  }
}

<!DOCTYPE HTML >
<html>

<head>
  <title> User Registration Page</title>
  <link href="UserRegistration.css" rel="stylesheet" type="text/css">
  <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
</head>

<body>
  <form action="UserInfo.html" method="POST" onsubmit="return validations(this);" onsubmit="return parse();">
    <div class="name">
      Name : <input type="text" id="nam" name="fullName">
    </div>
  
  <button type="submit" class="btn btn-primary btn-lg">Save</button>
 </form>
</body>

</html>

这是我无法显示我的姓名（UserInfo.html）的第二个html

<html> 
    <body> 
        Welcome : <span id= "result"> </span>
        <script>
        document.getElementById("result").innerHTML = localStorage.getItem("textvalue");


        </script>
    </body>
</html>

Answer 1

不要使用两个onsubmit属性。将所有功能聚合到一个内部，然后执行它。我已经将parse函数与验证合并。这是同一件事。另外，您从未提交过表格。这就是为什么函数也不会被触发的原因。也使用提交按钮。它应该在form标记内。不在外面

<!DOCTYPE HTML > 
<html>
<head> 
<title> User Registration Page</title>
<link href="UserRegistration.css" rel= "stylesheet" type="text/css">
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
<script>

function trimfield(str) { 
    return str.replace(/^\s+|\s+$/g,''); 
}
function validations(form) {
   var errors = [] ; 
   var n = document.getElementById("nam").value; 
   if (n == "") {
      errors.push("Enter Name \n"); 
   }

   if (errors.length > 0) {
       var msg = "Errors : \n\n" ; 
       for (var i = 0 ; i<errors.length; i++ ){ 
            msg = msg + errors[i]; 
       }
       alert(msg);
   }else{
       localStorage.setItem("textvalue", n); 
       alert(localStorage.getItem("textvalue"));
       return false;  
   }
}
</script>
</head>
<body>
   <form action="UserInfo.html" method="POST"  onsubmit="validations(this);">
       <div class = "name" >
        Name :   <input type ="text" id="nam" name="fullName" > 
       </div>
       <button type="submit" class="btn btn-primary btn-lg">Save</button>
    </form>
</body>
</html>

此外，也不知道您在哪里调用trimfield。在其他任何功能之外声明它，并在任何需要的地方使用它。

Answer 2

我试图纠正您犯的所有错误：

function parse() {
  var n = document.getElementById("nam").value;
  localStorage.setItem("textvalue", n);
  return true;

}

function validations(form) {
  function trimfield(str) {
    return str.replace(/^\s+|\s+$/g, '');
  }

  var errors = [];
  var n = document.getElementById("nam").value;
  if (n == "") {
    errors.push("Enter Name \n");
  }

  if (errors.length > 0) {
    var msg = "Errors : \n\n";
    for (var i = 0; i < errors.length; i++) {
      msg = msg + errors[i];
    }
    alert(msg);
    return false;
  }
  return true;
}

html：

<!DOCTYPE HTML >
<html>

<head>
  <title> User Registration Page</title>
  <link href="UserRegistration.css" rel="stylesheet" type="text/css">
  <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
</head>

<body>
  <form action="UserInfo.html" method="POST" onsubmit="if(validations(this)) return parse(); else return false;">
    <div class="name">
      Name : <input type="text" id="nam" name="fullName" />
    </div>

 <button type="submit" class="btn btn-primary btn-lg">Save</button>
  </form>

</body>

</html>

我无法将数据推送到另一个HTML页面

2 个答案: