zoukankan      html  css  js  c++  java
  • Jquery的小案例4、实现表单的验证(用户名和邮箱)

    <html>
    <head>
        <meta charset="utf-8"/>
        <script  src="jquery-1.4.2.min.js"></script>
    //在此处的Jquery文件封装的js文件下载地址http://download.csdn.net/detail/feilong_12/5210621   
        <script>

           $(function(){
                $(":input").each(function(){
                        var $ss=$("<strong>*</strong>");
                        $(this).parent().append($ss);
                });
                $(":input.name").blur(function(){
                    if($(this).is(".name")){
                    $(".formtip").remove();
                        if(this.value==""||this.value.length<6){
                                var eg="<span class='formtip'>用户名至少是6个字母</span>";
                                $(this).parent().append(eg);
                        }else{
                        
                                var masg="<span class='formtip'>用户名可以使用</span>";
                                $(this).parent().append(masg);
                        }
                    
                    
                    }    
                    })
                    
                        $(":input.mail").blur(function(){
                                if($(this).is(".mail")){
                                $(".emailtip").remove();
                                var reg=/\w{1,}@\w+\.\w+/;
                                var $dd=$(".mail").val();
                                if(!reg.test($dd)){
                                    var errMsg="<span class='emailtip'>邮箱不合法</span>";
                                    $(this).parent().append(errMsg);
                                }else{
                                var eee="<span class='emailtip'>您输入的邮箱符合规则</span>";
                                $(this).parent().append(eee);
                                }
                                }    
                        });
                        
                })
        </script>
    </head>
    <body>
            <div >用户名:<input type="text" class="name"/></div><br/>
            <div >密码:<input type="password"  class="pass"/></div>
            </br>
            <div  >邮箱:<input type="text" class="mail"/></div>
            <br/>
            <input type="button" value="注册"/>
    </body>
    </html>

  • 相关阅读:
    apicloud 运费计算js+页面
    css让字体细长
    vue 请求完接口后执行方法
    js监听当前页面再次加载
    用apicloud+vue的VueLazyload实现缓存图片懒加载
    git merge和git rebase的区别(转)
    yuan先生博客链接
    django组件之contenttype(一)
    Django的orm中get和filter的不同
    python第三方库requests详解
  • 原文地址:https://www.cnblogs.com/javawebsoa/p/2995405.html
Copyright © 2011-2022 走看看