今天做jsp页面上的表单提交,表单有一些校验,
校验的内容写在js函数check()里面。
html代码如下:
<form name="grform" action="......" method="post">
<label>身份证号:</label>
<input name="...." id="..." type="text" />
<input name="" type="button" value="查 询" οnclick="return check();" />
</form>
js代码如下:
function check(){ var name = document.getElementById("..."); if (name.value.trim() == "") { alert( "身份证号不能为空" ); return false } document.grform.submit(); }
在测试时发现按回车后,没有调用check函数直接就把表单提交了!
如果在form添加οnkeydοwn="if(event.keyCode==13){return false;}"
这样的效果就是按回车键不能提交表单。
但是我想按回车也能提交表单,提交之前调用check函数校验就好,用户体验更好点,
后来我检查了下表单,把提交按钮的type="button"改成type="submit" ,
经过各浏览器测试,发现在IE8下有bug……
后来又修改了几轮,以下方案在firefox、ie、360、谷歌浏览器下通过
=============================最终方案===================================
html代码如下:
<form name="grform" οnsubmit="return check();" <!--添加onsubmit监听事件-->
action="......" method="post">
<label>身份证号:</label>
<input name="...." id="..." type="text" />
<input name="" type="submit" value="查 询" /><!--去掉onclick属性-->
</form>
js代码如下:
function check(){ var name = document.getElementById("..."); if (name.value.trim() == "") { alert( "身份证号不能为空" ); return false } return true; //不要重复提交表单 }