Question

我想知道当JavaScript表单验证返回true时，如何将表单值从jsp页面中的html传递给Java类。

HTML code：

<form id="loginForm" onsubmit="return loginValidation()>
 <p class="error" id="liusrError"></p>
 <label for="usr">Username :</label>
 <br /> 
 <input type="text" name="liusr" id="liusr"> 
 <br />
 <p class="error" id="lipwdError"></p>
 <label for="pwd">Password :</label> <br /> 
 <input type="password" name="lipwd" id="lipwd">
 <br /> 
 <a id="fgtpwd" href="url">Forgot your password?</a> 
 <br /> 
 <input type="submit" value="Log In" id="logIn">
</form>

JavaScript：

function loginValidation(){
 var pwd = document.getElementById("lipwd").value;
 var usr = document.getElementById("liusr").value;
 var error = false;

 if(pwd == null || pwd == ""){
  document.getElementById("lipwdError").innerHTML = "Please enter a valid password";
  error = true;
 }else{
  document.getElementById("lipwdError").innerHTML = " ";
 }

 if(usr == null || usr==""){
  document.getElementById("liusrError").innerHTML = "Please enter a valid username";
  error = true;
 }else{
  document.getElementById("liusrError").innerHTML = " ";
 }

 return error;
}

编辑：

我想知道如何使用此<% if ( request.getParameter("liusr") != null ) { %>仅在JavaScript函数loginValidation返回true时将表单中输入的值发送到我的Java类。

Answer 1

如果您希望表单提交行为取决于您自己的功能，您必须使用：

onsubmit="return yourfunction()"

当你使用onsubmit =“yourfunction”时它不会影响默认行为，因为你的函数返回一个值，但在这种情况下onsubmit不关心它：）

所以你的代码应该是这样的：

<form id="loginForm" onsubmit="return loginValidation()>

Answer 2

您可能希望在验证完成后让您的<form>实际将其内容发布到网址：

<form id="loginForm" onsubmit="return loginValidation()" 
    method="POST" action="/login">

然后应该映射您的Java类以处理对/login的POST请求。

当JS验证返回true时，将表单值传递给java类

2 个答案: