< !--[si IE 9 ]> < !--[si IE 9 ]>

Maison >interface Web >Tutoriel H5 >Html5 implémente le code d'exemple de la fonction de vérification automatique de l'enregistrement des utilisateurs

Html5 implémente le code d'exemple de la fonction de vérification automatique de l'enregistrement des utilisateurs

黄舟
黄舟original
2017-02-20 13:59:522705parcourir

抽时间写了一个带有自动校验功能的Html5用户注册Demo。使用到Handlebars模板技术和手机验证码校验。

以下是效果截图:

Html5 implémente le code d'exemple de la fonction de vérification automatique de l'enregistrement des utilisateurs

1.页面代码:usersRegister.hbs

<!DOCTYPE html>     

    <!--[if IE 8 ]> <html lang="en" class="ie8"> <![endif]-->     

    <!--[if IE 9 ]> <html lang="en" class="ie9"> <![endif]-->     

    <!--[if (gt IE 9)|!(IE)]><!-->     

    <html lang="en">     

    <!--<![endif]-->     

    <head>     

        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">     

        <meta http-equiv="X-UA-Compatible" content="IE=edge" />     

        <title>用户注册</title>     

        <!--[if lt IE 9]>     

        <script src="/assets/scripts/html5shiv.js"></script>     

        <![endif]-->     

        <link href="/assets/styles/jquery.idealforms.min.css" rel="stylesheet" media="screen" />     

        <style type="text/css">     

            body {     

                font: normal 15px/1.5 Arial, Helvetica, Free Sans, sans-serif;     

                color: #222;     

                overflow-y: scroll;     

                padding: 60px 0 0 0;     

            }     

            .main {     

                width: 560px;     

                height: 480px;     

                margin: -50px auto;     

            }     

            #my-form {     

                width: 560px;     

                height: 450px;     

                margin: 0 auto;     

                border: 1px solid #ccc;     

                padding: 3em;     

                border-radius: 3px;     

                box-shadow: 0 0 2px rgba(0, 0, 0, .2);     

            }     

        </style>     

        <script type="text/javascript" src="/assets/scripts/jquery-1.8.2.min.js"></script>     

        <script type="text/javascript" src="/assets/scripts/jquery.idealforms.js"></script>     

    </head>     

    <body>     

    <!-- style="background-image: url(static/image/bg.jpg) -->     

        <p class="main" >     

            <p style="height:5px;text-align:center;font-size:25px"> 欢迎您注册!</p>     

            <!-- Begin Form -->     

            <form id="my-form" class="myform">     

                <p>     

                    <label>用户名:</label><input id="username" name="username" type="text" />     

                </p>     

                <p>     

                    <!-- <label>密码:</label><input id="pass" name="password" type="password" /> -->     

                    <label>密码:</label><input id="pass" name="password" type="text" />     

                </p>     

                <p>     

                    <label>邮箱:</label><input id="email" name="email"     

                                             data-ideal="required email" type="email" />     

                </p>     

                <p>     

                    <label>电话:</label><input id="telephone" type="text" name="phone" data-ideal="phone" />     

                </p>     

                <p>     

                    <label>供应商V码:</label><input id="vCode" type="text" name="vCode" data-ideal="vCode" />     

                </p>     

                <p>     

                    <label>真实姓名:</label><input id="trueName" type="text" name="trueName" data-ideal="trueName" />     

                </p>     

                <p>     

                    <label>手机验证码:</label><input id="telCode" type="text" name="telCode" data-ideal="telCode" />     

                </p>     

                <p style="margin-bottom:5px;">     

                    <button id="getTelCode" type="button" style="margin-left:160px; margin-right:auto;" >获取手机校验码</button>     

                    <hr style="margin-top:5px; margin-bottom:5px;" />     

                </p>     

                <!--<p>     

                    <label>性别:</label>     

                    <select id="sex" name="sex">     

                        <option value="男">男</option>     

                        <option value="女">女</option>     

                    </select>     

                </p>     

                <p>     

                    <label>昵称:</label><input id="nickName" type="text" name="nickName" data-ideal="nickName" />     

                </p>     

                <p>     

                    <label>年龄:</label><input id="age" type="text" name="age" data-ideal="age" />     

                </p>-->     

                <!-- <p>     

                    <label>地址:</label><input type="text" name="address" data-ideal="address" />     

                </p>     

                <p>     

                    <label>QQ:</label><input type="text" name="qq" data-ideal="qq" />     

                </p>     

                <p>     

                    <label>邮编:</label><input type="text" name="zip" data-ideal="zip" />     

                </p>     

                <p>     

                    <label>传真:</label><input type="text" name="fax" data-ideal="fax" />     

                </p>     

                <p>     

                    <label>身份证:</label><input type="text" name="creditID" data-ideal="creditID" />     

                </p>     

                <p>     

                    <label>出生日期:</label><input name="date" class="datepicker"     

                        data-ideal="date" type="text" placeholder="月/日/年" />     

                </p>     

                <p>     

                    <label>上传头像:</label><input id="file" name="file" multiple     

                        type="file" />     

                </p>     

                <p>     

                    <label>个人主页:</label><input name="website" data-ideal="url"     

                        type="text" />     

                </p>     

                <p>     

                    <label>备注:</label>     

                    <textarea id="comments" name="comments"></textarea>     

                </p>     

                -->     

                <!-- <p id="languages">     

                    <label>语言:</label> <label><input type="checkbox"     

                        name="langs[]" value="English" />英文</label> <label><input     

                        type="checkbox" name="langs[]" value="Chinese" />中文</label> <label><input     

                        type="checkbox" name="langs[]" value="Spanish" />西班牙文</label> <label><input     

                        type="checkbox" name="langs[]" value="French" />法文</label>     

                </p>     

                <p>     

                    <label>精通几门:</label> <label><input type="radio"     

                        name="radio" checked />1</label> <label><input type="radio"     

                        name="radio" />2</label> <label><input type="radio" name="radio" />3</label>     

                    <label><input type="radio" name="radio" />4</label>     

                </p>     

                <p>     

                    <label>国籍:</label> <select id="states" name="states">     

                        <option value="default">– 选择国籍 –</option>     

                        <option value="AL">阿拉伯</option>     

                        <option value="AK">中国</option>     

                        <option value="AZ">美国</option>     

                        <option value="AR">法国</option>     

                        <option value="CA">英国</option>     

                        <option value="CO">德国</option>     

                        <option value="CT">西班牙</option>     

                        <option value="DE">俄罗斯</option>     

                    </select>     

                </p> -->     

                <p style="margin-top:10px; margin-left:100px;margin-right:100px;">     

                    <button type="button" id="submit" class="submit">提交</button>     

                    <button id="reset" type="button" >重置</button>     

                </p>     

            </form>     

            <!-- End Form -->     

        </p>     

    <script type="text/javascript">     

        var options = {     

            onFail : function() {     

                alert($myform.getInvalid().length + &#39; invalid fields.&#39;)     

            },     

            inputs : {     

                &#39;password&#39; : {     

                    filters : &#39;required pass&#39;     

                },     

                &#39;username&#39; : {     

                    filters : &#39;required username&#39;     

                },     

                &#39;email&#39; : {     

                    filters : &#39;required email&#39;     

                },     

                &#39;phone&#39; : {     

                    filters : &#39;required phone&#39;     

                },     

                &#39;trueName&#39; : {     

                    filters : &#39;required&#39;     

                },     

                &#39;vCode&#39; : {     

                    filters : &#39;required&#39;     

                },     

                &#39;telCode&#39; : {     

                    filters : &#39;required&#39;     

                }     

                /*     

                &#39;age&#39; : {     

                    filters : &#39;required digits&#39;,     

                    data : {     

                       min : 16,     

                       max : 70     

                    }     

                },     

                &#39;file&#39; : {     

                    filters : &#39;extension&#39;,     

                    data : {     

                        extension : [ &#39;jpg&#39; ]     

                    }     

                },     

                &#39;comments&#39; : {     

                    filters : &#39;min max&#39;,     

                    data : {     

                        min : 50,     

                        max : 200     

                    }     

                },     

                &#39;states&#39; : {     

                    filters : &#39;exclude&#39;,     

                    data : {     

                        exclude : [ &#39;default&#39; ]     

                    },     

                    errors : {     

                        exclude : &#39;选择国籍.&#39;     

                    }     

                },     

                &#39;langs[]&#39; : {     

                    filters : &#39;min max&#39;,     

                    data : {     

                        min : 2,     

                        max : 3     

                    },     

                    errors : {     

                        min : &#39;Check at least <strong>2</strong> options.&#39;,     

                        max : &#39;No more than <strong>3</strong> options allowed.&#39;     

                    }     

                }     

                */     

            }     

        };     

        $(&#39;#getTelCode&#39;).click(function() {     

            var telephone = document.getElementById("telephone").value;   //手机号码     

            if (telephone == null || telephone == ""){     

                alert("手机号码不能为空!");     

            }     

            else{     

                $.ajax({     

                    type : "GET",     

                    dataType : "json",     

                    url : "../api/getTelCode?telephone="+ telephone,     

                    success : function(msg) {     

                    },     

                    error : function(e) {     

                        alert("获取手机校验码失败!" + e);     

                    }     

                });     

            }     

        });     

        var $myform = $(&#39;#my-form&#39;).idealforms(options).data(&#39;idealforms&#39;);     

        $(&#39;#submit&#39;).click(function() {     

            var username = document.getElementById("username").value; //用户名     

            var password = document.getElementById("pass").value;    //密码     

            var email = document.getElementById("email").value;     //邮箱     

            var telephone = document.getElementById("telephone").value;     //手机号码     

            var vCode = document.getElementById("vCode").value;     //公司V码     

            var telCode = document.getElementById("telCode").value;     //手机校验码     

            var trueName = document.getElementById("trueName").value;     //真实姓名     

            $.ajax({     

                type : "GET",     

                url : "../api/usersRegister?username="+ username +"password="+ password +"email="+ email +"telephone="+ telephone +"vCode="+ vCode +"
                telCode="+ telCode +"trueName="+ trueName,     

                success : function(msg) {     

                   //获取当前网址,如: http://www.php.cn/:8083/uimcardprj/share/meun.jsp     

                   var curWwwPath = window.document.location.href;     

                   //获取主机地址之后的目录,如: uimcardprj/share/meun.jsp     

                   var pathName = window.document.location.pathname;     

                   var pos = curWwwPath.indexOf(pathName);     

                   //获取主机地址,如: http://www.php.cn/:8083     

                   var localhostPaht = curWwwPath.substring(0, pos);     

                   //获取带"/"的项目名,如:/uimcardprj     

                   var projectName = pathName.substring(0, pathName.substr(1).indexOf(&#39;/&#39;) + 1);     

                   window.location.href = projectName + "/login";     

                   alert("注册成功!");     

                },     

                error : function(e) {     

                    alert("注册失败!" + e);     

                }     

            });     

        });     

        $(&#39;#reset&#39;).click(function() {     

            $myform.reset().fresh().focusFirst();     

        });     

    </script>     

    </body>     

    </html>



2.jq输入校验:jquery.idealforms.js

该js校验初始版本来自Cedric Ruiz,我略有修改。

部分校验的规则如下:

required: '此处是必填的.'

number: '必须是数字.',

digits: '必须是唯一的数字.'

name: '必须至少有3个字符长,并且只能包含字母.'

username: '用户名最短5位,最长30位,请使用英文字母、数字、中文和下划线. 用户名首字符必须为字母、数字、中文,不能为全数字.中文最长21个字.'

pass: '密码的位数必须的在6-15位之间,并且至少包含一个数字,一个大写字母和一个小写字母.'

strongpass: '必须至少为8个字符长,至少包含一个大写字母和一个小写字母和一个数字或特殊字符.'

email: '必须是一个有效的email地址. 907fae80ddef53131f3292ee4f81644b(例: user@gmail.com)d1c6776b927dc33c5d9114750b586338'

phone: '必须是一个有效的手机号码. 907fae80ddef53131f3292ee4f81644b(例: 18723101212)d1c6776b927dc33c5d9114750b586338'

以下是整个代码文件:

/*--------------------------------------------------------------------------    

      jq-idealforms 2.1    

      * Author: Cedric Ruiz    

      * License: GPL or MIT    

      * Demo: http://www.php.cn/    

      *    

    --------------------------------------------------------------------------*/     

    ;(function ( $, window, document, undefined ) {     

      &#39;use strict&#39;;     

      // Global Ideal Forms namespace     

      $.idealforms = {}     

      $.idealforms.filters = {}     

      $.idealforms.errors = {}     

      $.idealforms.flags = {}     

      $.idealforms.ajaxRequests = {}     

    /*--------------------------------------------------------------------------*/     

    /**    

     * @namespace A chest for various Utils    

     */     

    var Utils = {     

      /**    

       * Get width of widest element in the collection.    

       * @memberOf Utils    

       * @param {jQuery object} $elms    

       * @returns {number}    

       */     

      getMaxWidth: function( $elms ) {     

        var maxWidth = 0     

        $elms.each(function() {     

          var width = $(this).outerWidth()     

          if ( width > maxWidth ) {     

            maxWidth = width     

          }     

        })     

        return maxWidth     

      },     

      /**    

       * Hacky way of getting LESS variables    

       * @memberOf Utils    

       * @param {string} name The name of the LESS class.    

       * @param {string} prop The css property where the data is stored.    

       * @returns {number, string}    

       */     

      getLessVar: function( name, prop ) {     

        var value = $(&#39;<p class="&#39; + name + &#39;"></p>&#39;).hide().appendTo(&#39;body&#39;).css( prop )     

        $(&#39;.&#39; + name).remove()     

        return ( /^\d+/.test( value ) ? parseInt( value, 10 ) : value )     

      },     

      /**    

       * Like ES5 Object.keys    

       */     

      getKeys: function( obj ) {     

        var keys = []     

        for(var key in obj) {     

          if ( obj.hasOwnProperty( key ) ) {     

            keys.push( key )     

          }     

        }     

        return keys     

      },     

      // Get lenght of an object     

      getObjSize: function( obj ) {     

        var size = 0, key;     

        for ( key in obj ) {     

          if ( obj.hasOwnProperty( key ) ) {     

            size++;     

          }     

        }     

        return size;     

      },     

      isFunction: function( obj ) {     

        return typeof obj === &#39;function&#39;     

      },     

      isRegex: function( obj ) {     

        return obj instanceof RegExp     

      },     

      isString: function( obj ) {     

        return typeof obj === &#39;string&#39;     

      },     

      getByNameOrId: function( str ) {     

        var $el = $(&#39;[name="&#39;+ str +&#39;"]&#39;).length     

          ? $(&#39;[name="&#39;+ str +&#39;"]&#39;) // by name     

          : $(&#39;#&#39;+ str) // by id     

        return $el.length     

          ? $el     

          : $.error(&#39;The field "&#39;+ str + &#39;" doesn\&#39;t exist.&#39;)     

      },     

      getFieldsFromArray: function( fields ) {     

        var f = []     

        for ( var i = 0, l = fields.length; i < l; i++ ) {     

          f.push( Utils.getByNameOrId( fields[i] ).get(0) )     

        }     

        return $( f )     

      },     

      convertToArray: function( obj ) {     

        return Object.prototype.toString.call( obj ) === &#39;[object Array]&#39;     

          ? obj : [ obj ]     

      },     

      /**    

       * Determine type of any Ideal Forms element    

       * @param $input jQuery $input object    

       */     

      getIdealType: function( $el ) {     

        var type = $el.attr(&#39;type&#39;) || $el[0].tagName.toLowerCase()     

        return (     

          /(text|password|email|number|search|url|tel|textarea)/.test( type ) && &#39;text&#39; ||     

          /file/.test( type ) && &#39;file&#39; ||     

          /select/.test( type ) && &#39;select&#39; ||     

          /(radio|checkbox)/.test( type ) && &#39;radiocheck&#39; ||     

          /(button|submit|reset)/.test( type ) && &#39;button&#39; ||     

          /h\d/.test( type ) && &#39;heading&#39; ||     

          /hr/.test( type ) && &#39;separator&#39; ||     

          /hidden/.test( type ) && &#39;hidden&#39;     

        )     

      },     

      /**    

       * Generates an input    

       * @param name `name` attribute of the input    

       * @param type `type` or `tagName` of the input    

       */     

      makeInput: function( name, value, type, list, placeholder ) {     

        var markup, items = [], item, i, len     

        function splitValue( str ) {     

          var item, value, arr     

          if ( /::/.test( str ) ) {     

            arr = str.split(&#39;::&#39;)     

            item = arr[ 0 ]     

            value = arr[ 1 ]     

          } else {     

            item = value = str     

          }     

          return { item: item, value: value }     

        }     

        // Text & file     

        if ( /^(text|password|email|number|search|url|tel|file|hidden)$/.test(type) )     

          markup = &#39;<input &#39;+     

            &#39;type="&#39;+ type +&#39;" &#39;+     

            &#39;id="&#39;+ name +&#39;" &#39;+     

            &#39;name="&#39;+ name +&#39;" &#39;+     

            &#39;value="&#39;+ value +&#39;" &#39;+     

            (placeholder && &#39;placeholder="&#39;+ placeholder +&#39;"&#39;) +     

            &#39;/>&#39;     

        // Textarea     

        if ( /textarea/.test( type ) ) {     

          markup = &#39;<textarea id="&#39;+ name +&#39;" name="&#39;+ name +&#39;" value="&#39;+ value +&#39;"></textarea>&#39;     

        }     

        // Select     

        if ( /select/.test( type ) ) {     

          items = []     

          for ( i = 0, len = list.length; i < len; i++ ) {     

            item = splitValue( list[ i ] ).item     

            value = splitValue( list[ i ] ).value     

            items.push(&#39;<option value="&#39;+ value +&#39;">&#39;+ item +&#39;</option>&#39;)     

          }     

          markup =     

            &#39;<select id="&#39;+ name +&#39;" name="&#39;+ name +&#39;">&#39;+     

              items.join(&#39;&#39;) +     

            &#39;</select>&#39;     

        }     

        // Radiocheck     

        if ( /(radio|checkbox)/.test( type ) ) {     

          items = []     

          for ( i = 0, len = list.length; i < len; i++ ) {     

            item = splitValue( list[ i ] ).item     

            value = splitValue( list[ i ] ).value     

            items.push(     

              &#39;<label>&#39;+     

                &#39;<input type="&#39;+ type +&#39;" name="&#39;+ name +&#39;" value="&#39;+ value +&#39;" />&#39;+     

                item +     

              &#39;</label>&#39;     

            )     

          }     

          markup = items.join(&#39;&#39;)     

        }     

        return markup     

      }     

    }     

    /**    

     * Custom tabs for Ideal Forms    

     */     

    $.fn.idealTabs = function (container) {     

      var     

      // Elements     

      $contents = this,     

      $containercontainer = container,     

      $wrapper = $(&#39;<ul class="ideal-tabs-wrap"/>&#39;),     

      $tabs = (function () {     

        var tabs = []     

        $contents.each(function () {     

          var name = $(this).attr(&#39;name&#39;)     

          var html =     

            &#39;<li class="ideal-tabs-tab">&#39;+     

              &#39;<span>&#39; + name + &#39;</span>&#39;+     

              &#39;<i class="ideal-tabs-tab-counter ideal-tabs-tab-counter-zero">0</i>&#39;+     

            &#39;</li>&#39;     

          tabs.push(html)     

        })     

        return $(tabs.join(&#39;&#39;))     

      }()),     

      Actions = {     

        getCurIdx: function () {     

          return $tabs     

            .filter(&#39;.ideal-tabs-tab-active&#39;)     

            .index()     

        },     

        getTabIdxByName: function (name) {     

          var re = new RegExp(name, &#39;i&#39;)     

          var $tab = $tabs.filter(function () {     

            return re.test($(this).text())     

          })     

          return $tab.index()     

        }     

      },     

      /**    

       * Public methods    

       */     

      Methods = {     

        /**    

         * Switch tab    

         */     

        switchTab: function (nameOrIdx) {     

          var idx = Utils.isString(nameOrIdx)     

            ? Actions.getTabIdxByName(nameOrIdx)     

            : nameOrIdx     

          $tabs.removeClass(&#39;ideal-tabs-tab-active&#39;)     

          $tabs.eq(idx).addClass(&#39;ideal-tabs-tab-active&#39;)     

          $contents.hide().eq(idx).show()     

        },     

        nextTab: function () {     

          var idx = Actions.getCurIdx() + 1     

          idx > $tabs.length - 1     

            ? Methods.firstTab()     

            : Methods.switchTab(idx)     

        },     

        prevTab: function () {     

          Methods.switchTab(Actions.getCurIdx() - 1)     

        },     

        firstTab: function () {     

          Methods.switchTab(0)     

        },     

        lastTab: function () {     

          Methods.switchTab($tabs.length - 1)     

        },     

        updateCounter: function (nameOrIdx, text) {     

          var idx = !isNaN(nameOrIdx) ? nameOrIdx : Actions.getTabIdxByName(name),     

              $counter = $tabs.eq(idx).find(&#39;.ideal-tabs-tab-counter&#39;)     

          $counter.removeClass(&#39;ideal-tabs-tab-counter-zero&#39;)     

          if (!text) {     

            $counter.addClass(&#39;ideal-tabs-tab-counter-zero&#39;)     

          }     

          $counter.html(text)     

        }     

      }     

      // Attach methods     

      for (var m in Methods)     

        $contents[m] = Methods[m]     

      // Init     

      $tabs.first()     

        .addClass(&#39;ideal-tabs-tab-active&#39;)     

        .end()     

        .click(function () {     

          var name = $(this).text()     

          $contents.switchTab(name)     

        })     

      // Insert in DOM & Events     

      $wrapper.append($tabs).appendTo($container)     

      $contents.addClass(&#39;ideal-tabs-content&#39;)     

      $contents.each(function () {     

        var $this = $(this), name = $(this).attr(&#39;name&#39;)     

        $this.data(&#39;ideal-tabs-content-name&#39;, name)     

          .removeAttr(&#39;name&#39;)     

      })     

      $contents.hide().first().show() // Start fresh     

      return $contents     

    }     

    /**    

     * A custom <select> menu jQuery plugin    

     * @example `$(&#39;select&#39;).idealSelect()`    

     */     

    $.fn.idealSelect = function () {     

      return this.each(function () {     

        var     

        $select = $(this),     

        $options = $select.find(&#39;option&#39;)     

        /**    

         * Generate markup and return elements of custom select    

         * @memberOf $.fn.toCustomSelect    

         * @returns {object} All elements of the new select replacement    

         */     

        var idealSelect = (function () {     

          var     

          $wrap = $(&#39;<ul class="ideal-select &#39;+ $select.attr(&#39;name&#39;) +&#39;"/>&#39;),     

          $menu = $(     

            &#39;<li><span class="ideal-select-title">&#39; +     

              $options.filter(&#39;:selected&#39;).text() +     

            &#39;</span></li>&#39;     

          ),     

          items = (function () {     

            var items = []     

            $options.each(function () {     

              var $this = $(this)     

              items.push(&#39;<li class="ideal-select-item">&#39; + $this.text() + &#39;</li>&#39;)     

            })     

            return items     

          }())     

          $menu.append(&#39;<ul class="ideal-select-sub">&#39; + items.join(&#39;&#39;) + &#39;</ul>&#39;)     

          $wrap.append($menu)     

          return {     

            select: $wrap,     

            title: $menu.find(&#39;.ideal-select-title&#39;),     

            sub: $menu.find(&#39;.ideal-select-sub&#39;),     

            items: $menu.find(&#39;.ideal-select-item&#39;)     

          }     

        }())     

        /**    

         * @namespace Methods of custom select    

         * @memberOf $.fn.toCustomSelect    

         */     

        var Actions = {     

          getSelectedIdx: function () {     

            return idealSelect.items     

              .filter(&#39;.ideal-select-item-selected&#39;).index()     

          },     

          /**    

           * @private    

           */     

          init: (function () {     

            $select.css({     

              position: &#39;absolute&#39;,     

              left: &#39;-9999px&#39;     

            })     

            idealSelect.sub.hide()     

            idealSelect.select.insertAfter($select)     

            idealSelect.select.css(     

              &#39;min-width&#39;,     

              Utils.getMaxWidth(idealSelect.items)     

            )     

            idealSelect.items     

              .eq($options.filter(&#39;:selected&#39;).index())     

              .addClass(&#39;ideal-select-item-selected&#39;)     

          }()),     

          noWindowScroll: function (e) {     

            if (e.which === 40 || e.which === 38 || e.which === 13) {     

              e.preventDefault()     

            }     

          },     

          // Fix loosing focus when scrolling     

          // and selecting item with keyboard     

          focusHack: function () {     

            setTimeout(function () {     

              $select.trigger(&#39;focus&#39;)     

            }, 1)     

          },     

          focus: function () {     

            idealSelect.select.addClass(&#39;ideal-select-focus&#39;)     

            $(document).on(&#39;keydown.noscroll&#39;, Actions.noWindowScroll)     

          },     

          blur: function () {     

            idealSelect.select     

              .removeClass(&#39;ideal-select-open ideal-select-focus&#39;)     

            $(document).off(&#39;.noscroll&#39;)     

          },     

          scrollIntoView: function (dir) {     

            var     

            $selected = idealSelect.items.filter(&#39;.ideal-select-item-selected&#39;),     

            itemHeight = idealSelect.items.outerHeight(),     

            menuHeight = idealSelect.sub.outerHeight(),     

            isInView = (function () {     

              // relative position to the submenu     

              var elPos = $selected.position().top + itemHeight     

              return dir === &#39;down&#39;     

                ? elPos <= menuHeight     

                : elPos > 0     

            }())     

            if (!isInView) {     

              itemHeight = (dir === &#39;down&#39;)     

                ? itemHeight // go down     

                : -itemHeight // go up     

              idealSelect.sub     

                .scrollTop(idealSelect.sub.scrollTop() + itemHeight)     

            }     

          },     

          scrollToItem: function () {     

            var idx = Actions.getSelectedIdx(),     

                height = idealSelect.items.outerHeight(),     

                nItems = idealSelect.items.length,     

                allHeight = height * nItems,     

                curHeight = height * (nItems - idx)     

            idealSelect.sub.scrollTop(allHeight - curHeight)     

          },     

          showMenu: function () {     

            idealSelect.sub.fadeIn(&#39;fast&#39;)     

            idealSelect.select.addClass(&#39;ideal-select-open&#39;)     

            Actions.select(Actions.getSelectedIdx())     

            Actions.scrollToItem()     

          },     

          hideMenu: function () {     

            idealSelect.sub.hide()     

            idealSelect.select.removeClass(&#39;ideal-select-open&#39;)     

          },     

          select: function (idx) {     

            idealSelect.items     

              .removeClass(&#39;ideal-select-item-selected&#39;)     

            idealSelect.items     

              .eq(idx).addClass(&#39;ideal-select-item-selected&#39;)     

          },     

          change: function (idx) {     

            var text = idealSelect.items.eq(idx).text()     

            Actions.select(idx)     

            idealSelect.title.text(text)     

            $options.eq(idx).prop(&#39;selected&#39;, true)     

            $select.trigger(&#39;change&#39;)     

          },     

          keydown: function (key) {     

            var     

            idx = Actions.getSelectedIdx(),     

            isMenu = idealSelect.select.is(&#39;.ideal-select-menu&#39;),     

            isOpen = idealSelect.select.is(&#39;.ideal-select-open&#39;)     

            /**    

             * @namespace Key pressed    

             */     

            var keys = {     

              9: function () { // TAB     

                if (isMenu) {     

                  Actions.blur()     

                  Actions.hideMenu()     

                }     

              },     

              13: function () { // ENTER     

                if (isMenu)     

                  isOpen     

                    ? Actions.hideMenu()     

                    : Actions.showMenu()     

                Actions.change(idx)     

              },     

              27: function () { // ESC     

                if (isMenu) Actions.hideMenu()     

              },     

              40: function () { // DOWN     

                if (idx < $options.length - 1) {     

                  isOpen     

                    ? Actions.select(idx + 1)     

                    : Actions.change(idx + 1)     

                }     

                Actions.scrollIntoView(&#39;down&#39;)     

              },     

              38: function () { // UP     

                if (idx > 0) {     

                  isOpen     

                    ? Actions.select(idx - 1)     

                    : Actions.change(idx - 1)     

                }     

                Actions.scrollIntoView(&#39;up&#39;)     

              },     

              &#39;default&#39;: function () { // Letter     

                var     

                letter = String.fromCharCode(key),     

                $matches = idealSelect.items     

                  .filter(function () {     

                    return /^\w+$/i.test( letter ) && // not allow modifier keys ( ctrl, cmd, meta, super... )     

                      new RegExp(&#39;^&#39; + letter, &#39;i&#39;).test( $(this).text() ) // find first match     

                  }),     

                nMatches = $matches.length,     

                counter = idealSelect.select.data(&#39;counter&#39;) + 1 || 0,     

                curKey = idealSelect.select.data(&#39;key&#39;) || key,     

                newIdx = $matches.eq(counter).index()     

                if (!nMatches) // No matches     

                  return false     

                // If more matches with same letter     

                if (curKey === key) {     

                  if (counter < nMatches) {     

                    idealSelect.select.data(&#39;counter&#39;, counter)     

                  }     

                  else {     

                    idealSelect.select.data(&#39;counter&#39;, 0)     

                    newIdx = $matches.eq(0).index()     

                  }     

                }     

                // If new letter     

                else {     

                  idealSelect.select.data(&#39;counter&#39;, 0)     

                  newIdx = $matches.eq(0).index()     

                }     

                if (isOpen)     

                  Actions.select(newIdx)     

                else     

                  Actions.change(newIdx)     

                idealSelect.select.data(&#39;key&#39;, key)     

                Actions.scrollToItem()     

                Actions.focusHack()     

              }     

            }     

            keys[key]     

              ? keys[key]()     

              : keys[&#39;default&#39;]()     

          }     

        }     

        /**    

         * @namespace Holds all events of custom select for "menu mode" and "list mode"    

         * @memberOf $.fn.toCustomSelect    

         */     

        var events = {     

          focus: Actions.focus,     

          &#39;blur.menu&#39;: function () {     

            Actions.blur()     

            Actions.hideMenu()     

          },     

          &#39;blur.list&#39;: function () {     

            Actions.blur()     

          },     

          keydown: function (e) {     

            Actions.keydown(e.which)     

          },     

          &#39;clickItem.menu&#39;: function () {     

            Actions.change($(this).index())     

            Actions.hideMenu()     

          },     

          &#39;clickItem.list&#39;: function () {     

            Actions.change($(this).index())     

          },     

          &#39;clickTitle.menu&#39;: function () {     

            Actions.focus()     

            Actions.showMenu()     

            $select.trigger(&#39;focus&#39;)     

          },     

          &#39;hideOutside.menu&#39;: function () {     

            $select.off(&#39;blur.menu&#39;)     

            $(document).on(&#39;mousedown.ideal&#39;, function (evt) {     

              if (!$(evt.target).closest(idealSelect.select).length) {     

                $(document).off(&#39;mousedown.ideal&#39;)     

                $select.on(&#39;blur.menu&#39;, events[&#39;blur.menu&#39;])     

              } else {     

                Actions.focusHack()     

              }     

            })     

          },     

          &#39;mousedown.list&#39;: function () {     

            Actions.focusHack()     

          }     

        }     

        // Reset events     

        var disableEvents = function () {     

          idealSelect.select.removeClass(&#39;ideal-select-menu ideal-select-list&#39;)     

          $select.off(&#39;.menu .list&#39;)     

          idealSelect.items.off(&#39;.menu .list&#39;)     

          idealSelect.select.off(&#39;.menu .list&#39;)     

          idealSelect.title.off(&#39;.menu .list&#39;)     

        }     

        // Menu mode     

        idealSelect.select.on(&#39;menu&#39;, function () {     

          disableEvents()     

          idealSelect.select.addClass(&#39;ideal-select-menu&#39;)     

          Actions.hideMenu()     

          $select.on({     

            &#39;blur.menu&#39;: events[&#39;blur.menu&#39;],     

            &#39;focus.menu&#39;: events.focus,     

            &#39;keydown.menu&#39;: events.keydown     

          })     

          idealSelect.select.on(&#39;mousedown.menu&#39;, events[&#39;hideOutside.menu&#39;])     

          idealSelect.items.on(&#39;click.menu&#39;, events[&#39;clickItem.menu&#39;])     

          idealSelect.title.on(&#39;click.menu&#39;, events[&#39;clickTitle.menu&#39;])     

        })     

        // List mode     

        idealSelect.select.on(&#39;list&#39;, function () {     

          disableEvents()     

          idealSelect.select.addClass(&#39;ideal-select-list&#39;)     

          Actions.showMenu()     

          $select.on({     

            &#39;blur.list&#39;: events[&#39;blur.list&#39;],     

            &#39;focus.list&#39;: events.focus,     

            &#39;keydown.list&#39;: events.keydown     

          })     

          idealSelect.select.on(&#39;mousedown.list&#39;, events[&#39;mousedown.list&#39;])     

          idealSelect.items.on(&#39;mousedown.list&#39;, events[&#39;clickItem.list&#39;])     

        })     

        $select.keydown(function (e) {     

          // Prevent default keydown event     

          // to avoid bugs with Ideal Select events     

          if (e.which !== 9) e.preventDefault()     

        })     

        // Reset     

        idealSelect.select.on(&#39;reset&#39;, function(){     

          Actions.change(0)     

        })     

        idealSelect.select.trigger(&#39;menu&#39;) // Default to "menu mode"     

      })     

    }     

    /*    

     * idealRadioCheck: jQuery plguin for checkbox and radio replacement    

     * Usage: $(&#39;input[type=checkbox], input[type=radio]&#39;).idealRadioCheck()    

     */     

    $.fn.idealRadioCheck = function() {     

      return this.each(function() {     

        var $this = $(this)     

        var $span = $(&#39;<span/>&#39;)     

        $span.addClass( &#39;ideal-&#39;+ ( $this.is(&#39;:checkbox&#39;) ? &#39;check&#39; : &#39;radio&#39; ) )     

        $this.is(&#39;:checked&#39;) && $span.addClass(&#39;checked&#39;) // init     

        $span.insertAfter( $this )     

        $this.parent(&#39;label&#39;).addClass(&#39;ideal-radiocheck-label&#39;)     

          .attr(&#39;onclick&#39;, &#39;&#39;) // Fix clicking label in iOS     

        $this.css({ position: &#39;absolute&#39;, left: &#39;-9999px&#39; }) // hide by shifting left     

        // Events     

        $this.on({     

          change: function() {     

            var $this = $(this)     

            if ( $this.is(&#39;input[type="radio"]&#39;) ) {     

              $this.parent().siblings(&#39;label&#39;).find(&#39;.ideal-radio&#39;).removeClass(&#39;checked&#39;)     

            }     

            $span.toggleClass( &#39;checked&#39;, $this.is(&#39;:checked&#39;) )     

          },     

          focus: function() { $span.addClass(&#39;focus&#39;) },     

          blur: function() { $span.removeClass(&#39;focus&#39;) },     

          click: function() { $(this).trigger(&#39;focus&#39;) }     

        })     

      })     

    }     

    ;(function( $ ) {     

      // Browser supports HTML5 multiple file?     

      var multipleSupport = typeof $(&#39;<input/>&#39;)[0].multiple !== &#39;undefined&#39;,     

          isIE = /msie/i.test( navigator.userAgent )     

      $.fn.idealFile = function() {     

        return this.each(function() {     

          var $file = $(this).addClass(&#39;ideal-file&#39;), // the original file input     

              // label that will be used for IE hack     

              $wrap = $(&#39;<p class="ideal-file-wrap">&#39;),     

              $input = $(&#39;<input type="text" class="ideal-file-filename" />&#39;),     

              // Button that will be used in non-IE browsers     

              $button = $(&#39;<button type="button" class="ideal-file-upload">Open</button>&#39;),     

              // Hack for IE     

              $label = $(&#39;<label class="ideal-file-upload" for="&#39;+ $file[0].id +&#39;">Open</label>&#39;)     

          // Hide by shifting to the left so we     

          // can still trigger events     

          $file.css({     

            position: &#39;absolute&#39;,     

            left: &#39;-9999px&#39;     

          })     

          $wrap.append( $input, ( isIE ? $label : $button ) ).insertAfter( $file )     

          // Prevent focus     

          $file.attr(&#39;tabIndex&#39;, -1)     

          $button.attr(&#39;tabIndex&#39;, -1)     

          $button.click(function () {     

            $file.focus().click() // Open dialog     

          })     

          $file.change(function() {     

            var files = [], fileArr, filename     

            // If multiple is supported then extract     

            // all filenames from the file array     

            if ( multipleSupport ) {     

              fileArr = $file[0].files     

              for ( var i = 0, len = fileArr.length; i < len; i++ ) {     

                files.push( fileArr[i].name )     

              }     

              filename = files.join(&#39;, &#39;)     

            // If not supported then just take the value     

            // and remove the path to just show the filename     

            } else {     

              filename = $file.val().split(&#39;\\&#39;).pop()     

            }     

            $input.val( filename ) // Set the value     

              .attr( &#39;title&#39;, filename ) // Show filename in title tootlip     

          })     

          $input.on({     

            focus: function () { $file.trigger(&#39;change&#39;) },     

            blur: function () { $file.trigger(&#39;blur&#39;) },     

            keydown: function( e ) {     

              if ( e.which === 13 ) { // Enter     

                if ( !isIE ) { $file.trigger(&#39;click&#39;) }     

              } else if ( e.which === 8 || e.which === 46 ) { // Backspace & Del     

                // On some browsers the value is read-only     

                // with this trick we remove the old input and add     

                // a clean clone with all the original events attached     

                $file.replaceWith( $file = $file.val(&#39;&#39;).clone( true ) )     

                $file.trigger(&#39;change&#39;)     

                $input.val(&#39;&#39;)     

              } else if ( e.which === 9 ){ // TAB     

                return     

              } else { // All other keys     

                return false     

              }     

            }     

          })     

        })     

      }     

    }( jQuery ))     

    /**    

     * @namespace Errors    

     * @locale en    

     */     

    $.idealforms.errors = {     

      required: &#39;此处是必填的.&#39;,     

      number: &#39;必须是数字.&#39;,     

      digits: &#39;必须是唯一的数字.&#39;,     

      name: &#39;必须至少有3个字符长,并且只能包含字母.&#39;,     

      username: &#39;用户名最短5位,最长30位,请使用英文字母、数字、中文和下划线.用户名首字符必须为字母、数字、中文,不能为全数字.中文最长21个字.&#39;,     

      pass: &#39;密码的位数必须的在6-15位之间,并且至少包含一个数字,一个大写字母和一个小写字母.&#39;,     

      strongpass: &#39;必须至少为8个字符长,至少包含一个大写字母和一个小写字母和一个数字或特殊字符.&#39;,     

      email: &#39;必须是一个有效的email地址. <em>(例: user@gmail.com)</em>&#39;,     

      phone: &#39;必须是一个有效的手机号码. <em>(例: 18723101212)</em>&#39;,     

      zip: &#39;Must be a valid US zip code. <em>(e.g. 33245 or 33245-0003)</em>&#39;,     

      url: &#39;Must be a valid URL. <em>(e.g. www.google.com)</em>&#39;,     

      minChar: &#39;Must be at least <strong>{0}</strong> characters long.&#39;,     

      minOption: &#39;Check at least <strong>{0}</strong> options.&#39;,     

      maxChar: &#39;No more than <strong>{0}</strong> characters long.&#39;,     

      maxOption: &#39;No more than <strong>{0}</strong> options allowed.&#39;,     

      range: &#39;Must be a number between {0} and {1}.&#39;,     

      date: &#39;Must be a valid date. <em>(e.g. {0})</em>&#39;,     

      dob: &#39;Must be a valid date of birth.&#39;,     

      exclude: &#39;"{0}" is not available.&#39;,     

      excludeOption: &#39;{0}&#39;,     

      equalto: &#39;Must be the same value as <strong>"{0}"</strong>&#39;,     

      extension: &#39;File(s) must have a valid extension. <em>(e.g. "{0}")</em>&#39;,     

      ajaxSuccess: &#39;<strong>{0}</strong> is not available.&#39;,     

      ajaxError: &#39;Server error...&#39;     

    }     

    /**    

     * Get all default filters    

     * @returns object    

     */     

    var getFilters = function() {     

      var filters = {     

        required: {     

          regex: /.+/,     

          error: $.idealforms.errors.required     

        },     

        number: {     

          regex: function( i, v ) { return !isNaN(v) },     

          error: $.idealforms.errors.number     

        },     

        digits: {     

          regex: /^\d+$/,     

          error: $.idealforms.errors.digits     

        },     

        name: {     

          regex: /^[A-Za-z]{3,}$/,     

          error: $.idealforms.errors.name     

        },     

        username: {     

          regex: /^[a-z](?=[\w.]{4,30}$)\w*\.?\w*$/i,     

          error: $.idealforms.errors.username     

        },     

        pass: {     

          regex: /(?=.*\d)(?=.*[a-z])(?=.*[A-Z]).{6,}/,     

          error: $.idealforms.errors.pass     

        },     

        strongpass: {     

          regex: /(?=^.{8,}$)((?=.*\d)|(?=.*\W+))(?![.\n])(?=.*[A-Z])(?=.*[a-z]).*$/,     

          error: $.idealforms.errors.strongpass     

        },     

        email: {     

          regex: /^([a-zA-Z0-9]*[-_.]?[a-zA-Z0-9]+)*@([a-zA-Z0-9]*[-_]?[a-zA-Z0-9]+)+[\\.][A-Za-z]{2,3}([\\.][A-Za-z]{2})?$/,     

          error: $.idealforms.errors.email     

        },     

        phone: {     

          //regex: /^((13[0-9])|(15[0-9])|(17[0-9])|(18[0-9]))\\d{8}$/,     

          regex: /^(0|86|17951)?(13[0-9]|15[012356789]|17[678]|18[0-9]|14[57])[0-9]{8}$/,     

          error: $.idealforms.errors.phone     

        },     

        zip: {     

          regex: /^\d{5}$|^\d{5}-\d{4}$/,     

          error: $.idealforms.errors.zip     

        },     

        url: {     

          regex: /^(?:(ftp|http|https):\/\/)?(?:[\w\-]+\.)+[a-z]{2,6}([\:\/?#].*)?$/i,     

          error: $.idealforms.errors.url     

        },     

        min: {     

          regex: function( input, value ) {     

            var $inputinput = input.input,     

                min = input.userOptions.data.min,     

                isRadioCheck = $input.is(&#39;[type="checkbox"], [type="radio"]&#39;)     

            if ( isRadioCheck ) {     

              this.error = $.idealforms.errors.minOption.replace( &#39;{0}&#39;, min )     

              return $input.filter(&#39;:checked&#39;).length >= min     

            }     

            this.error = $.idealforms.errors.minChar.replace( &#39;{0}&#39;, min )     

            return value.length >= min     

          }     

        },     

        max: {     

          regex: function( input, value ) {     

            var $inputinput = input.input,     

                max = input.userOptions.data.max,     

                isRadioCheck = $input.is(&#39;[type="checkbox"], [type="radio"]&#39;)     

            if ( isRadioCheck ) {     

              this.error = $.idealforms.errors.maxOption.replace( &#39;{0}&#39;, max )     

              return $input.filter(&#39;:checked&#39;).length <= max     

            }     

            this.error = $.idealforms.errors.maxChar.replace( &#39;{0}&#39;, max )     

            return value.length <= max     

          }     

        },     

        range: {     

          regex: function( input, value ) {     

            var range = input.userOptions.data.range,     

                val = +value     

            this.error = $.idealforms.errors.range     

              .replace( &#39;{0}&#39;, range[0] )     

              .replace( &#39;{1}&#39;, range[1] )     

            return val >= range[0] && val <= range[1]     

          }     

        },     

        date: {     

          regex: function( input, value ) {     

            var     

            userFormat =     

              input.userOptions.data && input.userOptions.data.date     

                ? input.userOptions.data.date     

                : &#39;mm/dd/yyyy&#39;, // default format     

            delimiter = /[^mdy]/.exec( userFormat )[0],     

            theFormat = userFormat.split(delimiter),     

            theDate = value.split(delimiter),     

            isDate = function( date, format ) {     

              var m, d, y     

              for ( var i = 0, len = format.length; i < len; i++ ) {     

                if ( /m/.test( format[i]) ) m = date[i]     

                if ( /d/.test( format[i]) ) d = date[i]     

                if ( /y/.test( format[i]) ) y = date[i]     

              }     

              return (     

                m > 0 && m < 13 &&     

                y && y.length === 4 &&     

                d > 0 && d <= ( new Date( y, m, 0 ) ).getDate()     

              )     

            }     

            this.error = $.idealforms.errors.date.replace( &#39;{0}&#39;, userFormat )     

            return isDate( theDate, theFormat )     

          }     

        },     

        dob: {     

          regex: function( input, value ) {     

            var     

            userFormat =     

              input.userOptions.data && input.userOptions.data.dob     

                ? input.userOptions.data.dob     

                : &#39;mm/dd/yyyy&#39;, // default format     

            // Simulate a date input     

            dateInput = {     

              input: input.input,     

              userOptions: {     

                data: { date: userFormat }     

              }     

            },     

            // Use internal date filter to validate the date     

            isDate = filters.date.regex( dateInput, value ),     

            // DOB     

            theYear = /\d{4}/.exec( value ),     

            maxYear = new Date().getFullYear(), // Current year     

            minYear = maxYear - 100     

            this.error = $.idealforms.errors.dob     

            return isDate && theYear >= minYear && theYear <= maxYear     

          }     

        },     

        exclude: {     

          regex: function( input, value ) {     

            var $inputinput = input.input,     

                exclude = input.userOptions.data.exclude,     

                isOption = $input.is(&#39;[type="checkbox"], [type="radio"], select&#39;)     

            this.error = isOption     

              ? $.idealforms.errors.excludeOption.replace( &#39;{0}&#39;, value )     

              : this.error = $.idealforms.errors.exclude.replace( &#39;{0}&#39;, value )     

            return $.inArray( value, exclude ) === -1     

          }     

        },     

        equalto: {     

          regex: function( input, value ) {     

            var $equals = $( input.userOptions.data.equalto ),     

                $inputinput = input.input,     

                name = $equals.attr(&#39;name&#39;) || $equals.attr(&#39;id&#39;),     

                isValid = $equals.parents(&#39;.ideal-field&#39;)     

                  .filter(function(){ return $(this).data(&#39;ideal-isvalid&#39;) === true })     

                  .length     

            if ( !isValid ) { return false }     

            this.error = $.idealforms.errors.equalto.replace( &#39;{0}&#39;, name )     

            return $input.val() === $equals.val()     

          }     

        },     

        extension: {     

          regex: function( input, value ) {     

            var files = input.input[0].files || [{ name: value }],     

                extensions = input.userOptions.data.extension,     

                re = new RegExp( &#39;\\.&#39;+ extensions.join(&#39;|&#39;) +&#39;$&#39;, &#39;i&#39; ),     

                valid = false     

            for ( var i = 0, len = files.length; i < len; i++ ) {     

              valid = re.test( files[i].name );     

            }     

            this.error = $.idealforms.errors.extension.replace( &#39;{0}&#39;, extensions.join(&#39;", "&#39;) )     

            return valid     

          }     

        },     

        ajax: {     

          regex: function( input, value, showOrHideError ) {     

            var self = this     

            var $inputinput = input.input     

            var userOptions = input.userOptions     

            var name = $input.attr(&#39;name&#39;)     

            var $field = $input.parents(&#39;.ideal-field&#39;)     

            var valid = false     

            var customErrors = userOptions.errors && userOptions.errors.ajax     

            self.error = {}     

            self.error.success = customErrors && customErrors.success     

              ? customErrors.success     

              : $.idealforms.errors.ajaxSuccess.replace( &#39;{0}&#39;, value )     

            self.error.fail = customErrors && customErrors.error     

              ? customErrors.error     

              : $.idealforms.errors.ajaxError     

            // Send input name as $_POST[name]     

            var data = {}     

            data[ name ] = $.trim( value )     

            // Ajax options defined by the user     

            var userAjaxOps = input.userOptions.data.ajax     

            var ajaxOps = {     

              type: &#39;post&#39;,     

              dataType: &#39;json&#39;,     

              data: data,     

              success: function( resp, text, xhr ) {     

              console.log(resp)     

                showOrHideError( self.error.success, true )     

                $input.data({     

                  &#39;ideal-ajax-resp&#39;: resp,     

                  &#39;ideal-ajax-error&#39;: self.error.success     

                })     

                $input.trigger(&#39;change&#39;) // to update counter     

                $field.removeClass(&#39;ajax&#39;)     

                // Run custom success callback     

                if( userAjaxOps._success ) {     

                  userAjaxOps._success( resp, text, xhr )     

                }     

              },     

              error: function( xhr, text, error ) {     

                if ( text !== &#39;abort&#39; ) {     

                  showOrHideError( self.error.fail, false )     

                  $input.data( &#39;ideal-ajax-error&#39;, self.error.fail )     

                  $field.removeClass(&#39;ajax&#39;)     

                  // Run custom error callback     

                  if ( userAjaxOps._error ) {     

                    userAjaxOps._error( xhr, text, error )     

                  }     

                }     

              }     

            }     

            $.extend( ajaxOps, userAjaxOps )     

            // Init     

            $input.removeData(&#39;ideal-ajax-error&#39;)     

            $input.removeData(&#39;ideal-ajax-resp&#39;)     

            $field.addClass(&#39;ajax&#39;)     

            // Run request and save it to be able to abort it     

            // so requests don&#39;t bubble     

            $.idealforms.ajaxRequests[ name ] = $.ajax( ajaxOps )     

          }     

        }     

      }     

      return filters     

    }     

    $.idealforms.flags = {     

      noerror: function (i) {     

        i.parent().siblings(&#39;.ideal-error&#39;).hide()     

      },     

      noicons: function (i) {     

        i.siblings(&#39;.ideal-icon-valid, .ideal-icon-invalid&#39;).hide()     

      },     

      novalidicon: function (i) {     

        i.siblings(&#39;.ideal-icon-valid&#39;).hide()     

      },     

      noinvalidicon: function (i) {     

        i.siblings(&#39;.ideal-icon-invalid&#39;).hide()     

      },     

      noclass: function (i) {     

        i.parents(&#39;.ideal-field&#39;).removeClass(&#39;valid invalid&#39;)     

      },     

      novalidclass: function (i) {     

        i.parents(&#39;.ideal-field&#39;).removeClass(&#39;valid&#39;)     

      },     

      noinvalidclass: function (i) {     

        i.parents(&#39;.ideal-field&#39;).removeClass(&#39;invalid&#39;)     

      }     

    }     

    /*    

     * Ideal Forms plugin    

     */     

    var _defaults = {     

      inputs: {},     

      customFilters: {},     

      customFlags: {},     

      globalFlags: &#39;&#39;,     

      onSuccess: function(e) { alert(&#39;Thank you...&#39;) },     

      onFail: function() { alert(&#39;Invalid!&#39;) },     

      responsiveAt: &#39;auto&#39;,     

      disableCustom: &#39;&#39;     

    }     

    // Constructor     

    var IdealForms = function( element, options ) {     

      var self = this     

      self.$form = $( element )     

      self.opts = $.extend( {}, _defaults, options )     

      self.$tabs = self.$form.find(&#39;section&#39;)     

      // Set localized filters     

      $.extend( $.idealforms.filters, getFilters() )     

      self._init()     

    }     

    // Plugin     

    $.fn.idealforms = function( options ) {     

      return this.each(function() {     

        if ( !$.data( this, &#39;idealforms&#39; ) ) {     

          $.data( this, &#39;idealforms&#39;, new IdealForms( this, options ) )     

        }     

      })     

    }     

    // Get LESS variables     

    var LessVars = {     

      fieldWidth: Utils.getLessVar( &#39;ideal-field-width&#39;, &#39;width&#39; )     

    }     

    /*    

     * Private Methods    

     */     

    $.extend( IdealForms.prototype, {     

      _init: function() {     

        var self = this     

        var o = self.opts     

        var formElements = self._getFormElements()     

        self.$form.css( &#39;visibility&#39;, &#39;visible&#39; )     

          .addClass(&#39;ideal-form&#39;)     

          .attr( &#39;novalidate&#39;, &#39;novalidate&#39; ) // disable HTML5 validation     

        // Do markup     

        formElements.inputs     

          .add( formElements.headings )     

          .add( formElements.separators )     

          .each(function(){ self._doMarkup( $(this) ) })     

        // Generate tabs     

        if ( self.$tabs.length ) {     

          var $tabContainer = $(&#39;<p class="ideal-wrap ideal-tabs ideal-full-width"/>&#39;)     

          self.$form.prepend( $tabContainer )     

          self.$tabs.idealTabs( $tabContainer )     

        }     

        // Always show datepicker below the input     

        if ( jQuery.ui ) {     

          $.datepicker._checkOffset = function( a,b,c ) { return b }     

        }     

        // Add inputs specified by data-ideal     

        // to the list of user inputs     

        self.$form.find(&#39;[data-ideal]&#39;).each(function() {     

          var userInput = o.inputs[ this.name ]     

          o.inputs[ this.name ] = userInput || { filters: $(this).data(&#39;ideal&#39;) }     

        })     

       // Responsive     

        if ( o.responsiveAt ) {     

          $(window).resize(function(){ self._responsive() })     

          self._responsive()     

        }     

        // Form events     

        self.$form.on({     

          keydown: function( e ) {     

            // Prevent submit when pressing enter     

            // but exclude textareas     

            if ( e.which === 13 && e.target.nodeName !== &#39;TEXTAREA&#39; ) {     

              e.preventDefault()     

            }     

          },     

          submit: function( e ) {     

            if ( !self.isValid() ) {     

              e.preventDefault()     

              o.onFail()     

              self.focusFirstInvalid()     

            } else {     

              o.onSuccess( e )     

            }     

          }     

        })     

        self._adjust()     

        self._attachEvents()     

        self.fresh() // Start fresh     

      },     

      _getFormElements: function() {     

        return {     

          inputs: this.$form.find(&#39;input, select, textarea, :button&#39;),     

          labels: this.$form.find(&#39;p > label:first-child&#39;),     

          text: this.$form.find(&#39;input:not([type="checkbox"], [type="radio"], [type="submit"]), textarea&#39;),     

          select: this.$form.find(&#39;select&#39;),     

          radiocheck: this.$form.find(&#39;input[type="radio"], input[type="checkbox"]&#39;),     

          buttons: this.$form.find(&#39;:button&#39;),     

          file: this.$form.find(&#39;input[type="file"]&#39;),     

          headings: this.$form.find(&#39;h1, h2, h3, h4, h5, h6&#39;),     

          separators: this.$form.find(&#39;hr&#39;),     

          hidden: this.$form.find(&#39;input:hidden&#39;)     

        }     

      },     

      _getUserInputs: function() {     

        return this.$form.find(&#39;[name="&#39;+ Utils.getKeys( this.opts.inputs ).join(&#39;"], [name="&#39;) +&#39;"]&#39;)     

      },     

      _getTab: function( nameOrIdx ) {     

        var self = this     

        var isNumber = !isNaN( nameOrIdx )     

        if ( isNumber ) {     

          return self.$tabs.eq( nameOrIdx )     

        }     

        return self.$tabs.filter(function() {     

          var re = new RegExp( nameOrIdx, &#39;i&#39; )     

          return re.test( $(this).data(&#39;ideal-tabs-content-name&#39;) )     

        })     

      },     

      _getCurrentTabIdx: function() {     

        return this.$tabs.index( this.$form.find(&#39;.ideal-tabs-content:visible&#39;) )     

      },     

      _updateTabsCounter: function() {     

        var self = this     

        self.$tabs.each(function( i ) {     

          var invalid = self.getInvalidInTab( i ).length     

          self.$tabs.updateCounter( i, invalid )     

        })     

      },     

      _adjust: function() {     

        var self = this     

        var o = self.opts     

        var formElements = self._getFormElements()     

        var curTab = self._getCurrentTabIdx()     

        // Autocomplete causes some problems...     

        formElements.inputs.attr(&#39;autocomplete&#39;, &#39;off&#39;)     

        // Show tabs to calculate dimensions     

        if ( self.$tabs.length ) { self.$tabs.show() }     

        // Adjust labels     

        var labels = formElements.labels     

        labels.removeAttr(&#39;style&#39;).width( Utils.getMaxWidth( labels ) )     

        // Adjust headings and separators     

        if ( self.$tabs.length ) {     

          this.$tabs.each(function(){     

            $( this ).find(&#39;.ideal-heading:first&#39;).addClass(&#39;first-child&#39;)     

          })     

        } else {     

          self.$form.find(&#39;.ideal-heading:first&#39;).addClass(&#39;first-child&#39;)     

        }     

        self._setDatepicker()     

        // Done calculating hide tabs     

        if ( self.$tabs.length ) {     

          self.$tabs.hide()     

          self.switchTab( curTab )     

        }     

      },     

      _setDatepicker: function() {     

        var o = this.opts     

        var $datepicker = this.$form.find(&#39;input.datepicker&#39;)     

        if ( jQuery.ui && $datepicker.length ) {     

          $datepicker.each(function() {     

            var userInput = o.inputs[ this.name ]     

            var data = userInput && userInput.data && userInput.data.date     

            var format = data ? data.replace( &#39;yyyy&#39;, &#39;yy&#39; ) : &#39;mm/dd/yy&#39;     

            $(this).datepicker({     

              dateFormat: format,     

              beforeShow: function( input ) {     

                $( input ).addClass(&#39;open&#39;)     

              },     

              onChangeMonthYear: function() {     

                // Hack to fix IE9 not resizing     

                var $this = $(this)     

                var w = $this.outerWidth() // cache first!     

                setTimeout(function() {     

                  $this.datepicker(&#39;widget&#39;).css( &#39;width&#39;, w )     

                }, 1)     

              },     

              onClose: function() { $(this).removeClass(&#39;open&#39;) }     

            })     

          })     

          // Adjust width     

          $datepicker.on(&#39;focus keyup&#39;, function() {     

            var t = $(this), w = t.outerWidth()     

            t.datepicker(&#39;widget&#39;).css( &#39;width&#39;, w )     

          })     

          $datepicker.parent().siblings(&#39;.ideal-error&#39;).addClass(&#39;hidden&#39;)     

        }     

      },     

      _doMarkup: function( $element ) {     

        var o = this.opts     

        var elementType = Utils.getIdealType( $element )     

        // Validation elements     

        var $field = $(&#39;<span class="ideal-field"/>&#39;)     

        var $error = $(&#39;<span class="ideal-error" />&#39;)     

        var $valid = $(&#39;<i class="ideal-icon ideal-icon-valid" />&#39;)     

        var $invalid = $(&#39;<i class="ideal-icon ideal-icon-invalid"/>&#39;)     

          .click(function(){     

            $(this).parent().find(&#39;input:first, textarea, select&#39;).focus()     

          })     

        // Basic markup     

        $element.closest(&#39;p&#39;).addClass(&#39;ideal-wrap&#39;)     

          .children(&#39;label:first-child&#39;).addClass(&#39;ideal-label&#39;)     

        var idealElements = {     

          _defaultInput: function() {     

            $element.wrapAll( $field ).after( $valid, $invalid )     

              .parent().after( $error )     

          },     

          text: function() { idealElements._defaultInput() },     

          radiocheck: function() {     

            // Check if input is already wrapped so we don&#39;t     

            // wrap radios and checks more than once     

            var isWrapped = $element.parents(&#39;.ideal-field&#39;).length     

            if ( !isWrapped ) {     

              $element.parent().nextAll().andSelf().wrapAll( $field.addClass(&#39;ideal-radiocheck&#39;) )     

              $element.parents(&#39;.ideal-field&#39;).append( $valid, $invalid ).after( $error )     

            }     

            if ( !/radiocheck/.test( o.disableCustom ) ) {     

              $element.idealRadioCheck()     

            }     

          },     

          select: function() {     

            idealElements._defaultInput()     

            if ( !/select/.test( o.disableCustom ) ) {     

              $element.idealSelect()     

            }     

          },     

          file: function() {     

            idealElements._defaultInput()     

            if ( !/file/.test( o.disableCustom ) ) {     

              $element.idealFile()     

            }     

          },     

          button: function() {     

            if ( !/button/.test( o.disableCustom ) ) {     

              $element.addClass(&#39;ideal-button&#39;)     

            }     

          },     

          hidden: function() {     

            $element.closest(&#39;p&#39;).addClass(&#39;ideal-hidden&#39;)     

          },     

          heading: function() {     

            $element.closest(&#39;p&#39;).addClass(&#39;ideal-full-width&#39;)     

            $element.parent().children().wrapAll(&#39;<span class="ideal-heading"/>&#39;)     

          },     

          separator: function() {     

            $element.closest(&#39;p&#39;).addClass(&#39;ideal-full-width&#39;)     

            $element.wrapAll(&#39;<p class="ideal-separator"/>&#39;)     

          }     

        }     

        // Generate markup for current element type     

        idealElements[ elementType ] ? idealElements[ elementType ]() : $.noop()     

        $error.add( $valid ).add( $invalid ).hide() // Start fresh     

      },     

      /** Validates an input and shows or hides error and icon    

       * @memberOf Actions    

       * @param {object} $input jQuery object    

       * @param {string} e The JavaScript event    

       */     

      _validate: function( $input, e ) {     

        var self = this     

        var o = this.opts     

        var userOptions = o.inputs[ $input.attr(&#39;name&#39;) ]     

        var userFilters = userOptions.filters && userOptions.filters.split(/\s/)     

        var name = $input.attr(&#39;name&#39;)     

        var value = $input.val()     

        var ajaxRequest = $.idealforms.ajaxRequests[ name ]     

        var isRadioCheck = $input.is(&#39;[type="checkbox"], [type="radio"]&#39;)     

        var inputData = {     

          // If is radio or check validate all inputs related by name     

          input: isRadioCheck ? self.$form.find(&#39;[name="&#39; + name + &#39;"]&#39;) : $input,     

          userOptions: userOptions     

        }     

        // Validation elements     

        var $field = $input.parents(&#39;.ideal-field&#39;)     

        var $error = $field.siblings(&#39;.ideal-error&#39;)     

        var $invalid = isRadioCheck     

          ? $input.parent().siblings(&#39;.ideal-icon-invalid&#39;)     

          : $input.siblings(&#39;.ideal-icon-invalid&#39;)     

        var $valid = isRadioCheck     

          ? $input.parent().siblings(&#39;.ideal-icon-valid&#39;)     

          : $input.siblings(&#39;.ideal-icon-valid&#39;)     

        function resetError() {     

          $field.removeClass(&#39;valid invalid&#39;).removeData(&#39;ideal-isvalid&#39;)     

          $error.add( $invalid ).add( $valid ).hide()     

        }     

        function showOrHideError( error, valid ) {     

          resetError()     

          valid ? $valid.show() : $invalid.show()     

          $field.addClass( valid ? &#39;valid&#39; : &#39;invalid&#39; )     

          $field.data( &#39;ideal-isvalid&#39;, valid )     

          if ( !valid ) {     

            $error.html( error ).toggle( $field.is(&#39;.ideal-field-focus&#39;) )     

          }     

        }     

        // Prevent validation when typing but not introducing any new characters     

        // This is mainly to prevent multiple AJAX requests     

        var oldValue = $input.data(&#39;ideal-value&#39;) || 0     

        $input.data( &#39;ideal-value&#39;, value )     

        if ( e.type === &#39;keyup&#39; && value === oldValue ) { return false }     

        // Validate     

        if ( userFilters ) {     

          $.each( userFilters, function( i, filter ) {     

            var theFilter = $.idealforms.filters[ filter ]     

            var customError = userOptions.errors && userOptions.errors[ filter ]     

            var error = &#39;&#39;     

            // If field is empty and not required     

            if ( !value && filter !== &#39;required&#39; ) {     

              resetError()     

              return false     

            }     

            if ( theFilter ) {     

              // Abort and reset ajax if there&#39;s a request pending     

              if ( e.type === &#39;keyup&#39; && ajaxRequest ) {     

                ajaxRequest.abort()     

                $field.removeClass(&#39;ajax&#39;)     

              }     

              // AJAX     

              if ( filter === &#39;ajax&#39; ) {     

                showOrHideError( error, false ) // set invalid till response comes back     

                $error.hide()     

                if ( e.type === &#39;keyup&#39; ) {     

                  theFilter.regex( inputData, value, showOrHideError ) // runs the ajax callback     

                } else {     

                  var ajaxError = $input.data(&#39;ideal-ajax-error&#39;)     

                  if ( ajaxError ) {     

                    showOrHideError( ajaxError, $input.data(&#39;ideal-ajax-resp&#39;) || false )     

                  }     

                }     

              }     

              // All other filters     

              else {     

                var valid = Utils.isRegex( theFilter.regex ) && theFilter.regex.test( value ) ||     

                            Utils.isFunction( theFilter.regex ) && theFilter.regex( inputData, value )     

                error = customError || theFilter.error // assign error after calling regex()     

                showOrHideError( error, valid )     

                if ( !valid ) { return false }     

              }     

            }     

          })     

        }     

        // Reset if there are no filters     

        else {     

          resetError()     

        }     

        // Flags     

        var flags = (function(){     

          var f = userOptions.flags && userOptions.flags.split(&#39; &#39;) || []     

          if ( o.globalFlags ) {     

            $.each( o.globalFlags.split(&#39; &#39;), function( i,v ) { f.push(v) })     

          }     

          return f     

        }())     

        if ( flags.length ) {     

          $.each(flags, function( i,f ) {     

            var theFlag = $.idealforms.flags[f]     

            if ( theFlag ) { theFlag( $input, e.type ) }     

          })     

        }     

        // Update counter     

        if ( self.$tabs.length ) {     

          self._updateTabsCounter( self._getCurrentTabIdx() )     

        }     

      },     

      _attachEvents: function() {     

        var self = this     

        self._getUserInputs().on(&#39;keyup change focus blur&#39;, function(e) {     

          var $this = $(this)     

          var $field = $this.parents(&#39;.ideal-field&#39;)     

          var isFile = $this.is(&#39;input[type=file]&#39;)     

          // Trigger on change if type=file cuz custom file     

          // disables focus on original file input (tabIndex = -1)     

          if ( e.type === &#39;focus&#39; || isFile && e.type === &#39;change&#39; ) {     

            $field.addClass(&#39;ideal-field-focus&#39;)     

          }     

          if ( e.type === &#39;blur&#39; ) {     

            $field.removeClass(&#39;ideal-field-focus&#39;)     

          }     

          self._validate( $this, e )     

        })     

      },     

      _responsive: function() {     

        var formElements = this._getFormElements()     

        var maxWidth = LessVars.fieldWidth + formElements.labels.outerWidth()     

        var $emptyLabel = formElements.labels.filter(function() {     

          return $(this).html() === &#39; &#39;     

        })     

        var $customSelect = this.$form.find(&#39;.ideal-select&#39;)     

        this.opts.responsiveAt === &#39;auto&#39;     

          ? this.$form.toggleClass( &#39;stack&#39;, this.$form.width() < maxWidth )     

          : this.$form.toggleClass( &#39;stack&#39;, $(window).width() < this.opts.responsiveAt )     

        var isStack = this.$form.is(&#39;.stack&#39;)     

        $emptyLabel.toggle( !isStack )     

        $customSelect.trigger( isStack ? &#39;list&#39; : &#39;menu&#39; )     

        // Hide datePicker     

        var $datePicker = this.$form.find(&#39;input.hasDatepicker&#39;)     

        if ( $datePicker.length ) { $datePicker.datepicker(&#39;hide&#39;) }     

      }     

    })     

    /*    

     * Public Methods    

     */     

    $.extend( IdealForms.prototype, {     

      getInvalid: function() {     

        return this.$form.find(&#39;.ideal-field&#39;).filter(function() {     

          return $(this).data(&#39;ideal-isvalid&#39;) === false     

        })     

      },     

      getInvalidInTab: function( nameOrIdx ) {     

        return this._getTab( nameOrIdx ).find(&#39;.ideal-field&#39;).filter(function() {     

          return $(this).data(&#39;ideal-isvalid&#39;) === false     

        })     

      },     

      isValid: function() {     

        return !this.getInvalid().length     

      },     

      isValidField: function( field ) {     

        var $input = Utils.getByNameOrId( field )     

        return $input.parents(&#39;.ideal-field&#39;).data(&#39;ideal-isvalid&#39;) === true     

      },     

      focusFirst: function() {     

        if ( this.$tabs.length ) {     

          this.$tabs.filter(&#39;:visible&#39;)     

            .find(&#39;.ideal-field:first&#39;)     

            .find(&#39;input:first, select, textarea&#39;).focus()     

        } else {     

          this.$form.find(&#39;.ideal-field:first&#39;)     

            .find(&#39;input:first, select, textarea&#39;).focus()     

        }     

        return this     

      },     

      focusFirstInvalid: function() {     

        var $first = this.getInvalid().first().find(&#39;input:first, select, textarea&#39;)     

        var tabName = $first.parents(&#39;.ideal-tabs-content&#39;).data(&#39;ideal-tabs-content-name&#39;)     

        if ( this.$tabs.length ) {     

          this.switchTab( tabName )     

        }     

        $first.focus()     

        return this     

      },     

      switchTab: function( nameOrIdx ) {     

        this.$tabs.switchTab( nameOrIdx )     

        return this     

      },     

      nextTab: function() {     

        this.$tabs.nextTab()     

        return this     

      },     

      prevTab: function() {     

        this.$tabs.prevTab()     

        return this     

      },     

      firstTab: function() {     

        this.$tabs.firstTab()     

        return this     

      },     

      lastTab: function() {     

        this.$tabs.lastTab()     

        return this     

      },     

      fresh: function() {     

        this._getUserInputs().change().parents(&#39;.ideal-field&#39;)     

          .removeClass(&#39;valid invalid&#39;)     

        return this     

      },     

      freshFields: function( fields ) {     

        fields = Utils.convertToArray( fields )     

        $.each( fields, function( i ) {     

          var $input = Utils.getByNameOrId( fields[ i ] )     

          $input.change().parents(&#39;.ideal-field&#39;).removeClass(&#39;valid invalid&#39;)     

        })     

        return this     

      },     

      reload: function() {     

        this._adjust()     

        this._attachEvents()     

        return this     

      },     

      reset: function() {     

        var formElements = this._getFormElements()     

        formElements.text.val(&#39;&#39;) // text inputs     

        formElements.radiocheck.removeAttr(&#39;checked&#39;) // radio & check     

        // Select and custom select     

        formElements.select.find(&#39;option&#39;).first().prop( &#39;selected&#39;, true )     

        this.$form.find(&#39;.ideal-select&#39;).trigger(&#39;reset&#39;)     

        if ( this.$tabs.length ) { this.firstTab() }     

        this.focusFirst().fresh()     

        return this     

      },     

      resetFields: function( fields ) {     

        fields = Utils.convertToArray( fields )     

        var formElements = this._getFormElements()     

        $.each( fields, function( i, v ) {     

          var $input = Utils.getByNameOrId( v )     

          var type = Utils.getIdealType( $input )     

          if ( type === &#39;text&#39; || type === &#39;file&#39; ) {     

            $input.val(&#39;&#39;)     

          }     

          if ( type === &#39;radiocheck&#39; ) {     

            $input.removeAttr(&#39;checked&#39;) // radio & check     

          }     

          if ( type === &#39;select&#39; ) {     

            $input.find(&#39;option&#39;).first().prop( &#39;selected&#39;, true )     

            $input.next(&#39;.ideal-select&#39;).trigger(&#39;reset&#39;)     

          }     

          $input.change()     

        })     

        this.freshFields( fields )     

        return this     

      },     

      toggleFields: function( fields ) {     

        fields = Utils.convertToArray( fields )     

        var self = this     

        var $fields = Utils.getFieldsFromArray( fields )     

        $fields.each(function() {     

          var $this = $(this)     

          var name = $this.attr(&#39;name&#39;) || $this.attr(&#39;id&#39;)     

          var input = self.opts.inputs[ name ]     

          var filters = input && input.filters     

          var dataFilters = $this.data(&#39;ideal-filters&#39;) || &#39;&#39;     

          $this.data( &#39;ideal-filters&#39;, filters )     

          $this.closest(&#39;.ideal-wrap&#39;).toggle()     

          self.setFieldOptions( name, { filters: dataFilters } )     

        })     

        return this     

      },     

      setOptions: function( options ) {     

        $.extend( true, this.opts, options )     

        this.reload().fresh()     

        return this     

      },     

      setFieldOptions: function( name, options ) {     

        $.extend( true, this.opts.inputs[ name ], options )     

        this.reload().freshFields([ name ])     

        return this     

      },     

      addFields: function( fields ) {     

        fields = Utils.convertToArray( fields )     

        var self = this     

        // Save names of all inputs in Array     

        // to use methods that take names ie. fresh()     

        var allNames = []     

        // Add an input to the DOM     

        function add( ops ) {     

          var name = ops.name     

          var userOptions = {     

            filters: ops.filters || &#39;&#39;,     

            data: ops.data || {},     

            errors: ops.errors || {},     

            flags: ops.flags || &#39;&#39;     

          }     

          var label = ops.label || &#39;&#39;     

          var type = ops.type     

          var list = ops.list || []     

          var placeholder = ops.placeholder || &#39;&#39;     

          var value = ops.value || &#39;&#39;     

          var $field = $(&#39;<p>&#39;+     

              &#39;<label>&#39;+ label +&#39;:</label>&#39;+     

              Utils.makeInput( name, value, type, list, placeholder ) +     

            &#39;</p>&#39;)     

          var $input = $field.find(&#39;input, select, textarea, :button&#39;)     

          // Add inputs with filters to the list     

          // of user inputs to validate     

          if ( userOptions.filters ) { self.opts.inputs[ name ] = userOptions }     

          self._doMarkup( $input )     

          // Insert in DOM     

          if ( ops.addAfter ) {     

            $field.insertAfter(     

              $( Utils.getByNameOrId( ops.addAfter ) ).parents(&#39;.ideal-wrap&#39;)     

            )     

          } else if ( ops.addBefore ) {     

            $field.insertBefore(     

              $(Utils.getByNameOrId( ops.addBefore ))     

              .parents(&#39;.ideal-wrap&#39;)     

            )     

          } else if ( ops.appendToTab ) {     

            $field.insertAfter(     

              self._getTab( ops.appendToTab ).find(&#39;.ideal-wrap:last-child&#39;)     

            )     

          } else {     

            $field.insertAfter( self.$form.find(&#39;.ideal-wrap&#39;).last() )     

          }     

          // Add current field name to list of names     

          allNames.push( name )     

        }     

        // Run through each input     

        $.each( fields, function( i, ops ) { add( ops ) })     

        self.reload()     

        self.freshFields( allNames )     

        self._responsive()     

        return this     

      },     

      removeFields: function( fields ) {     

        fields = Utils.convertToArray( fields )     

        var $fields = Utils.getFieldsFromArray( fields )     

        $fields.parents(&#39;.ideal-wrap&#39;).remove()     

        this.reload()     

        return this     

      }     

    })     

    }( jQuery, window, document ))



 以上就是Html5实现用户注册自动校验功能实例代码 的内容,更多相关内容请关注PHP中文网(www.php.cn)!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn