jquery完成表单验证
来源:互联网 发布:iphone4s越狱软件 编辑:程序博客网 时间:2024/06/05 05:36
<!doctype html> <head> <meta charset=utf-8" /> <title>表单验证</title> <link href="css/style1.css"rel="stylesheet"type="text/css" /> <!-- 引入jQuery --> <script src="jquery/jquery.js"type="text/javascript"></script> <script> $(document).ready(function() { $("form :input.required").each(function() { var $required=$("<strong class=high>*</strong>"); $(this).parent().append($required); }); $("form :input").blur(function() { var $parent=$(this).parent(); $parent.find(".formtips").remove(); if($(this).is("#username")){ if(this.value==""||this.value.length<6){ var errorMsg='请输入至少六位的用户名'; $parent.append('<span class="formtips onError">'+errorMsg+'</span>'); }else{ var okMsg='输入正确'; $parent.append('<span class="formtips onSuccess">'+okMsg+'</span>'); return false; } } if($(this).is("#email")){ if(this.value==""||(this.value!==""&&!/.+@.+\.[a-zA-Z]{2,4}$/.test(this.value))){ var errorMsg='请输入正确的E—mail地址'; $parent.append('<span class="formtips onError">'+errorMsg+'</span>'); }else{ var okMsg='输入正确'; $parent.append('<span class="formtips onSuccess">'+okMsg+'</span>'); } } }); $("#send").click(function() { $("form .required:input").trigger('blur'); var numError=$("form .onError").length; if(numError){ return false; } alert("注册成功,密码已发到你的邮箱,请查收。"); }); }); </script> </head> <body> <form method="post" action=""> <div class="int"> <label for="username">用户名:</label> <input type="text" id="username" class="required" /> </div> <div class="int"> <label for="email">邮箱:</label> <input type="text" id="email" class="required" /> </div> <div class="int"> <label for="personinfo">个人资料:</label> <input type="text" id="personinfo" /> </div> <div class="sub"> <input type="submit" value="提交" id="send"/><inputtype="reset"id="res"/> </div> </form> </body> </html>
阅读全文
0 0
- jquery,完成表单验证
- jquery完成表单验证
- jQuery表单验证及jQuery自动完成提示插件
- Jquery(十一)实战表单验证与自动完成提示插件
- 使用jQuery的validation插件来完成表单的验证
- [JAVAWEB]4.用jQuery完成数据验证和表单提交
- jQuery框架学习第十一天:实战jQuery表单验证及jQuery自动完成提示插件
- jQuery框架学习第十一天:实战jQuery表单验证及jQuery自动完成提示插件
- jQuery框架学习第十一天:实战jQuery表单验证及jQuery自动完成提示插件
- JQuery EasyUI表单-表单验证
- 21. PHP 表单验证 - 完成表单实例
- jquery 表单验证插件
- JQuery验证表单例子
- jQuery对表单验证
- jquery表单验证插件
- jquery表单验证
- jquery 通用表单验证
- jquery表单验证
- CodeForces 855C Helga Hufflepuff's Cup(树形dp)
- 超全面的JavaWeb笔记day15<mysql数据库>
- chrome jsonView插件安装
- vue按需引入element Transfer 穿梭框
- Java--枚举
- jquery完成表单验证
- jsp的九大内置对象
- [BZOJ1227][SDOI2009]虔诚的墓主人
- IDEA怎么样通过终端指令第一次提交代码到github
- 657. Judge Route Circle
- 集合各实现类的底层实现原理
- Python实现中文词云(wordcloud),根据背景图片生成词云
- Java--泛型
- python_lintcode_97二叉树的最大深度 _155二叉树的最小深度