Bootstrap 表单验证

Question

修改了wecenter花哨的表单验证提示后如下

          <div class="col_full">
            <label for="reg_name">用户名:</label>
            <input type="text" name="user_name" id="reg_name" class="form-control" value="" placeholder="请输入一个 2-14 位的用户名" />
          </div>

<script type="text/javascript">
$(document).ready(function() {
    verify_register_form('#register_form');
    /* 注册页面验证 */
    function verify_register_form(element) {
        $(element).find('[type=text], [type=password]').on({
            focus: function() {
                if (typeof $(this).attr('tips') != 'undefined' && $(this).attr('tips') != '') {
                    $(this).parent().addClass('has-success');
                }
            },
            blur: function() {
                if ($(this).attr('tips') != '') {
                    switch ($(this).attr('name')) {
                    case 'user_name':
                        var _this = $(this);
                        if ($(this).val().length >= 0 && $(this).val().length < 2) {
                            $(this).parent().addClass('has-error');
                            return;
                        }
                        if ($(this).val().length > 17) {
                            $(this).parent().addClass('has-error');
                            return;
                        } else {
                            $.post(G_BASE_URL + '/account/ajax/check_username/', {
                                username: $(this).val()
                            },
                            function(result) {
                                if (result.errno == -1) {
                                   _this.parent().addClass('has-error');
                                } else {
                                    _this.parent().addClass('has-success');
                                }
                            }, 'json');
                        }
                        return;
                    }
                }
            }
        });
    }
});
</script>

现在的问题是任意项报错has-error再修正后依然无法改变状态，也就是表单失去焦点不重新验证添加has-success，其中if ($(this).attr('tips') != '') {这if貌似多于，求修正方法，先谢过！

简单的说假如首次输入名字不符合规则表单class添加has-error警示，用户修改正解后依然不改变表单红色边框！

源码

                <li>
                    <input class="aw-register-name form-control" type="text" name="user_name" placeholder="<?php _e('用户名'); ?>" tips="<?php _e('请输入一个 2-14 位的用户名');?>" errortips="<?php _e('用户名长度不符合');?>" value="" />
                </li>

    verify_register_form('#register_form');

    /* 注册页面验证 */
    function verify_register_form(element)
    {
        $(element).find('[type=text], [type=password]').on({
            focus : function()
            {
                if (typeof $(this).attr('tips') != 'undefined' && $(this).attr('tips') != '')
                {
                    $(this).parent().append('<span class="aw-reg-tips">' + $(this).attr('tips') + '</span>');
                }
            },
            blur : function()
            {
                if ($(this).attr('tips') != '')
                {
                    switch ($(this).attr('name'))
                    {
                        case 'user_name' :
                            var _this = $(this);
                            $(this).parent().find('.aw-reg-tips').detach();
                            if ($(this).val().length >= 0 && $(this).val().length < 2)
                            {
                                $(this).parent().find('.aw-reg-tips').detach();
                                $(this).parent().append('<span class="aw-reg-tips aw-reg-err"><i class="aw-icon i-err"></i>' + $(this).attr('errortips') + '</span>');
                                return;
                            }
                            if ($(this).val().length > 17)
                            {
                                $(this).parent().find('.aw-reg-tips').detach();
                                $(this).parent().append('<span class="aw-reg-tips aw-reg-err"><i class="aw-icon i-err"></i>' + $(this).attr('errortips') + '</span>');
                                return;
                            }
                            else
                            {
                                $.post(G_BASE_URL + '/account/ajax/check_username/', 
                                    {
                                        username: $(this).val()
                                    }, function (result)
                                {
                                    if (result.errno == -1)
                                    {
                                        _this.parent().find('.aw-reg-tips').detach();
                                        _this.parent().append('<span class="aw-reg-tips aw-reg-err"><i class="aw-icon i-err"></i>' + result.err + '</span>');
                                    }
                                    else
                                    {
                                        _this.parent().find('.aw-reg-tips').detach();
                                        _this.parent().append('<span class="aw-reg-tips aw-reg-right"><i class="aw-icon i-followed"></i></span>');
                                    }
                                }, 'json');
                            }
                            return;

                    }
                }

            }
        });
    }

Answer 1

自己琢磨.removeClass('has-error') 搞掂。