Question

我有一个表单，一旦我的jQuery完成表单验证，我想重定向到成功页面。

我做错了什么？

＆＃13;

$("#submit").click(function() {
  if ($("#employeeID").val() == "") {
    $("#message1").html("Employee ID can't be null");
  }
  if ($("#password").val() == "") {
    $("#message2").html("Password can't be null");
  }

});

＆＃13;

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form name="loginform" method="post" class="login-form">
  <div class="form-group">
    <label for="employeeID">EmployeeID</label><input type="text" name="employeeID" id="employeeID" placeholder="employeeID" class="form-control" /><span id="message1"></span><br>
    <label for="password">Password</label> <input type="password" name="password" id="password" placeholder="password" class="form-control" /><span id="message2"></span><br>
    <input type="submit" id="submit" value="Login" />
    <p class="message">Not registered? <a href="/validationSpringMVC/createAccount.html">Create an account</a></p>
  </div>

</form>

＆＃13;

Answer 1

每当JQuery完成表单验证时，请使用以下内容重定向到成功页面

window.location.replace("https://www.websitename.com/success-page"); //this is just a example

Answer 2

您可以这样做：

<script type="text/javascript">

   $("#submit").click(function(){ 

      if($("#employeeID").val()== ""){
         $("#message1").html("Employee ID can't be null");
         return false;
      } 

      if($("#password").val()== ""){
         $("#message2").html("Password can't be null");
         return false;
      }
      window.location.replace("https://yourdomain/successpage");
   }); 
</script>

Answer 3

最好处理onsubmit事件而不是点击提交按钮的事件。您可以在表单的var 3dArray:[[[String]]] = [[[50]],[[50]],[[50]]]参数内设置成功页面的URL。如果提交事件处理程序返回action，则提交操作将被取消。否则请求将发送到指定的URL。

false

$("form").submit(function() {
  var hasError = false;
  $(".has-error, .has-success").removeClass("has-error").removeClass("has-success");
  if ($("#employeeID").val() == "") {
    $("#employeeID").closest(".form-group").addClass("has-error");
    hasError = true;
  } else {
    $("#employeeID").closest(".form-group").addClass("has-success");
  }
  if ($("#password").val() == "") {
    $("#password").closest(".form-group").addClass("has-error");
    hasError = true;
  } else {
    $("#password").closest(".form-group").addClass("has-success");
  }
  return !hasError;
});

.form-group:not(.has-error) .error-message {
  display: none !important;
}

另请参阅.submit()方法文档。

我还更正了您的HTML。在上面的代码中，表单提交事件的处理程序在表单控件上应用validation states取决于输入值。错误消息可见性由其他CSS规则控制。即使其中一个输入为空，处理程序也会阻止发送。

表单验证后重定向

3 个答案: