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>

  • 相关阅读:
    Forms Authentication Against An XML File
    ADO.NET 2.0 中的新增 DataSet 功能
    转一篇:是什么导致了业务人员和技术人员的矛盾?
    谁说雨中登泰山别有一番风味的????
    缓存用户控件输出的多个版本
    Creating Collection Classes in C#
    Why Create a DataSet, use a DataTable
    Adding Relationships to DataTables
    读取手机联系人和SIM卡联系人
    Android移动动画的参数
  • 原文地址:https://www.cnblogs.com/javawebsoa/p/2995405.html
Copyright © 2011-2022 走看看