如何使用异步方法(promises 或 async-await)等其他方法验证表单?

How I can validate the form with another method like asynchronous methods(promises or async-await)?

如何使用异步方法(promises 或 async-await)等其他方法验证下面的表单?

在下面的表单中,如果 onsubmit ="return validateForm()" 等于布尔值 true 则表单被验证,如果 onsubmit ="return validateForm() 则不被验证" 等于布尔值 false。

我的问题是:异步函数总是 return 承诺,而不是 return 布尔值...

<!DOCTYPE html>
<html>
   <head>
      <title>Hello Javascript</title>
      <script type = "text/javascript">
         function validateForm()  {
             var u = document.getElementById("username").value;
             var p = document.getElementById("password").value;

             if(u== "") {
                 alert("Please enter your Username");
                 return false;
             }
             if(p == "") {
                 alert("Please enter you Password");
                 return false;
             }

             alert("All datas are valid!, send it to the server!")

             return true;
         }
      </script>
   </head>
   <body>

      <h2>Enter your Username and Password</h2>

      <div style="border:1px solid #ddd; padding: 5px;">
         <form method="POST" action="process-action.html" onsubmit = "return validateForm()">
            Username: <input type="text" name="username" id="username"/>
            <br><br>
            Password: <input type="password" name = "password" id="password"/>
            <br><br>
            <button type="submit">Submit</button>
         </form>
      </div>

   </body>
</html>

你写的验证码是同步客户端代码,不需要promise来执行。

您在这里需要做的是使用 e.preventDefault,否则提交按钮将尝试触发表单提交到服务器。

以这个 answer 为例。

如果您走这条路,请使用 e.preventDefault 来防止触发表单提交,验证表单并通过启动 ajax 调用来提交。