form中的onsubmit验证

提交表单时的验证有很多返方式,可以用JS,在button的onclick中触发。也可以将input的type设置成submit,在form中onsubmit进行验证

这里说说第二种方式的问题form中onsubmit进行验证

function test()
{
var sum
if(document.frm.title.value=='')
{
alert('请填写标题');
return false;

}

}

<form action="result.php" method="post" onsubmit="test()">
 <table>
   <tr>
     <td width="30%">留言标题</td>
     <td><input type="text" name="title" size="20" /></td>
   </tr>
   <tr>
     <td><input type="submit" value="提交"></td>
   </tr>
 </table>    
</form>

上面的例子即使JS返回的是false,也能通过提交,Why?

onsubmit属性就像是<form>对象的一个方法名,其值(一个字符串)就是其方法体,默认返回true;在该方法体中你可以写任意多个语句,包括内置函数和自定义函数,

就相当于代码:

Form.prototype.onsubmit = function() {

    alert('submit'); // 内置函数

    submitForm (); //你自定义函数

    ......(任意多条语句)   

    return false;

};

<form action="result.php" method="post" onsubmit="test()">就被理解为overridel了默认的submitForm ()方法

Form.prototype.onsubmit = function() {

   test();

};

在这里submitForm()虽然返回false,但我们只执行了此函数,没有对其结果进行任何处理。

所以正确的做法是

<form action="result.php" method="post" onsubmit=" return test()">

这样我们利用到了它的返回值,达到了预期效果。

override方法的效果为: 

Form.prototype.onsubmit = function() {

    return  submitForm();

};

原文地址:https://www.cnblogs.com/lzhlearn/p/5810964.html