无需任何额外代码的客户端验证

分享于 

3分钟阅读

Web开发

  繁體 雙語
开始 <--文章- 不添加 html/正文启动 TAGS--> !

介绍

它是一个简单的javascript code.By,使用这个代码我们可以使用正则表达式验证web表单。 好的是,你不需要编写额外的代码,只需在隐藏字段中放置适当的正则表达式。

详细信息

背后的想法是,为了验证名称 "集合",你必须添加两个隐藏输入 fields.One,以获取的验证和控制标题的其他 input。 验证字段的名称是 "regex_text1",标题的名称将是"caption_text1"。

根据你要写入的正则表达式,输入控件将被验证,你将在 "regex_text1"输入字段的value属性 of。

另一件事情是,通过单击你要提交的按钮来调用下面的函数。


<BLOCKQUOTE dir=ltr style="MARGIN-RIGHT: 0px">


<P>function ValidateForm()<BR>{<BR> els=new Array();<BR> els=document.forms[1].elements;<BR> for(i=0; i<els.length; i++)<BR> {<BR> <BR> var regex="regex_" + els[i].name;<BR> if(els[regex]!=null)<BR> { <BR> var regexValue=els[regex].value;<BR> var elValue=els[i].value;<BR> var re = new RegExp(regexValue);<BR> if(!elValue.match(re))<BR> {<BR> var caption="caption_" + els[i].name;<BR> var captionValue="Field"; <BR> if(els[caption]!=null)<BR> captionValue=els[caption].value;<BR> alert("Invalid" + captionValue);<BR> return; <BR> }<BR> } <BR> <BR> <BR> <BR> }<BR> document.forms[1].submit();</P>


<P>} </P></BLOCKQUOTE>


<P dir=ltr>and your html would be like this.</P>


<BLOCKQUOTE dir=ltr style="MARGIN-RIGHT: 0px">


<P dir=ltr><input type="text" name="txtSurname"><BR> <input type="hidden" name="caption_txtSurname" value="Surname"><BR> <input type="hidden" name="regex_txtSurname" value="^[a-zA-Z]+[a-zA-Z ]*$"></P>


<P dir=ltr><input type="text" name="txtPostCode"><BR> <input type="hidden" name="regex_txtPostCode" value="^([0-9]+[0-9-]*[0-9]+)?$"><BR> <input type="hidden" name="caption_txtPostCode" value="Post Code"></P>


<P dir=ltr><input  type="button" name="Submit" value="Submit" onClick="javascript:ValidateForm()"></P></BLOCKQUOTE>




cod  ext  SID  Extra  客户端验证  
相关文章