最近在做驗證的時候遇到了submit()與onsubmit()事件沖突的問題，本來想在a標簽中添加submit()進行表單的提交，然后在 form中添加onsubmit事件觸發驗證方法。結果行不通，最后只能選擇在java script中進行表單的提交。方案如下：
設置form頭部如下：添加id是為了在java script腳本中進行中獲取form對象
<form method="post" action="AdminServlet" id="Loginform" >
在a標簽中添加onClick()事件，觸發java script表單驗證的方法loginLayoutValidate()
<a href="javascript:void(0)" onClick="loginLayoutValidate()"/>
function loginLayoutValidate(){ var userName=document.getElementById("userName"); var passWord= document.getElementById("passWord"); var validateCode=document.getElementById("validateCode"); if(userName.value.trim()==""){ alert("用戶名不能為空"); return ; } else if(passWord.value.trim()==""){ alert("密碼不能為空"); return ; } else if(validateCode.value.trim()==""){ alert("請輸入驗證碼"); return ; } else{ document.getElementById("Loginform").submit(); } }
例子:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <script> function submitcheck() { if (document.getElementById('name').value == '') { alert('必須輸入網站名！'); document.getElementById('name').focus(); return false; } else if (document.getElementById('ftp_url').value == '') { alert('必須輸入Ftp地址！'); document.getElementById('ftp_url').focus(); return false; } else { document.getElementById('fm_1').submit(); } } </script> </head> <body> <form action="#" id="fm_1" name="fm_1"> <input type="text" id="name" name="name" required="required">* <br> <input type="text" id="ftp_url" name="ftp_url">* <br> <input type="submit" value="提交"> <br> <input type="reset" value="重置"> <br> <a href="javascript:void(0)" onclick="checkform()">提交</a> <br><a href="#" onclick="document.fm_1.reset()">重置</a> </form> </body> </html>