表单验证 什么是表单验证,它的作用是什么
很多朋友对于表单验证和什么是表单验证,它的作用是什么不太懂,今天就由小编来为大家分享,希望可以帮助到大家,下面一起来看看吧!
什么是表单验证,它的作用是什么
表单验证是javascript中的高级选项之一。JavaScript可用来在数据被送往服务器前对 HTML表单中的这些输入数据进行验证。
表单验证的作用:
下面的函数用来检查用户是否已填写表单中的必填(或必选)项目。假如必填或必选项为空,那么警告框会弹出,并且函数的返回值为 false,否则函数的返回值则为 true(意味着数据没有问题):
function validate_required(field, alerttxt)
{ with(field)
{ if(value== null|| value=="")
{ alert(alerttxt); return false;}
else{ return true;}}}
下面是连同 HTML表单的代码:
<html><head><script type="text/javascript"> function validate_required(field, alerttxt){ with(field){ if(value== null|| value==""){ alert(alerttxt); return false;} else{ return true;}}} function validate_form(thisform){ with(thisform){ if(validate_required(email,"Email must be filled out!")== false){ email.focus(); return false;}}}</script></head><body><form action="submitpage.htm" onsubmit="return validate_form(this)" method="post"> Email:<input type="text" name="email" size="30"><input type="submit" value="Submit"></form></body></html>
请问这是什么意思,什么叫表单验证
表单验证是javascript中的高级选项之一。
JavaScript可用来在数据被送往服务器前对HTML表单中的这些输入数据进行验证。
被 JavaScript验证的这些典型的表单数据有:
1、用户是否已填写表单中的必填项目?
2、用户输入的邮件地址是否合法?
3、用户是否已输入合法的日期?
4、用户是否在数据域(numeric field)中输入了文本?
表单验证怎么做
<form id="form1" name="form1" method="get" action="" onsubmit="return checkform();">
账号:
<input type="text" name="textfield" id="zhanghao"/>(5位)<br/>
密码:
<input type="text" name="textfield2" id="mima"/><br/>
重复密码:
<input type="text" name="textfield3" id="chongfu"/><br/>
<input type="submit" value="提交"/>
</form>
<script type="text/javascript">
checkform= function(){
var js_zhanghao= document.getElementById("zhanghao");//这个是账号的id
var js_mima= document.getElementById("mima");//这个是密码的id
var js_chongfu= document.getElementById("chongfu");//这个是重复密码的id
if(js_zhanghao.value.length<5){//js_zhanghao这个是账号输入框的对象 js_zhanghao.value这个是获取他的数据 length这个长度的意思这里做的是判断
alert("长度请大于5位");
return false;//这个返回否定就是不让表单提交
}
if(js_mima.value==""||js_chongfu.value==""){//js_mima.value这个是第一个密码框的对象的值然后和js_chongfu的数据进行判断不为空
alert("请填写完整");
return false;//这个返回否定就是不让表单提交
}
if(js_mima.value!=js_chongfu.value){//js_mima.value这个是第一个密码框的对象的值然后和js_chongfu的数据进行比较
alert("两次密码请一致");
return false;//这个返回否定就是不让表单提交
}
return true;
}
</script>
<!--代码和注释全部加上了不明白的可以M我-->
2011年
HTML5中表单验证的好处
HTML5中表单验证有如下好处:
1、可判断用户是否已填写表单中的必填项目。
2、可判断用户输入的邮件地址是否合法。
3、可判断用户是否已输入合法的日期。
4、可判断用户是否在数据域(numeric field)中输入了文本。
表单验证通常采用策略模式的思想,把一个个验证规则封装成一个函数,比如非空规则、最大长度规则等,不同的输入框选择某一个或者某几个规则进行验证。
扩展资料:
HTML表单一直都是Web的核心技术之一,有了它才能在Web上进行各种各样的应用。HTML5 Forms新增了许多新控件及其API,方便做更复杂的应用,而不用借助其它Javascript框架。
表单有以下几个基本知识点:
1、表单仍是以<form>元素作为容器,可在其中设置基本的提交特性。
2、当用户提交页面时,表单仍然向服务器发送表单控件的值。
3、之前老版本中的表单控件,如text radio checkbox等等,都可以按原有方式使用,尽管增加了新的功能。
4、仍然可以使用javascript操作表单控件。
文章分享结束,表单验证和什么是表单验证,它的作用是什么的答案你都知道了吗?欢迎再次光临本站哦!