关于form提交表单和onclick事件的触发

我们在提交的时候会对数据进行验证，在form表单的提交按钮上绑定处理JavaScript事件的问题总结。

这种做法是利用按钮(注意不是submit)先进行前台验证，然后在验证成功的情况下进行表单提交，

<script type="text/javascript">

function check(){

var password = document.getElementById("password").value;

var pwd = document.getElementById("pwd").value;

if(password==pwd){

        alert("验证正确");

       document.getElementById('form1').submit(); //验证成功进行表单提交

}else{

      alert("验证错误，请重新输入");

       //window.location.href="index.jsp"; 可以将其连接到指定的位置

} }

</script>

<form action="deal" method="post" id="form1">
    用 户 名:<input type="text" name="username" id="username">
    密   码:<input type="password" name="password" id="password">
    确认密码:<input type="password" name="pwd" id="pwd">
<input type="button" οnclick="check()" value="提交" >
</form>

方法二是利用form表单的onsubmit方法进行调用，当进行表单提交时，会先执行onsubmit( )方法，然后栽根据返回的false进行处理，注意这里只有在返回false的情况下不进行提交。

根据input的类型进行相应的选择，一般建议使用button，

<script type="text/javascript">

function check2(){

var password = document.getElementById("password").value;

var pwd = document.getElementById("pwd").value;

if(password==pwd){

alert("验证正确");

return true;

}else{

alert("验证错误，请重新输入");

//window.location.href="index.jsp"; return false;

} }

</script>

<form action="deal.action" method="post" id="form1" οnsubmit="return check2();">
    用  户  名:<input type="text" name="username" id="username">
    密    码:<input type="password" name="password" id="password">
    确认密码:<input type="password" name="pwd" id="pwd">
<input type="submit" value="提交" >  
</form>