0

我在这里面临一个严重的困境,我在输入标签上使用引导工具提示进行表单验证,即当出现表单验证错误时,工具提示会自动出现在输入标签周围,问题是

1)工具提示仅在第二次调用onBlur时出现或触发,虽然它应该在光标第一次离开输入标签时出现,代码是

$("input#formName").each(function() {
     $("#formName").on("blur",this, function(){
        var x=document.getElementById("formName").value;
        //
        if (x==null || x=="")
        {
          var error = "Name Must Not Be Empty"; 
          $('#formName').tooltip({
            trigger: 'manual',
            title: error
            }).on({
                blur: function() {
                    $(this).tooltip('show');
                },
                focus: function() {
                    $(this).tooltip('hide');
                }
            });
        }else{
            $('#formName').data('tooltip',false);
        }

    });

        $("#formName").on("blur",this, function(){
            var y=document.getElementById("formName").value;
            if (y.length < 6){
                var error2 = "Length of Name Must Br Greater than 6";
                $('#formName').tooltip({
                trigger: 'manual',
                title: error2
                }).on({
                    blur: function() {
                        $(this).tooltip('show');
                    },
                    focus: function() {
                        $(this).tooltip('hide');
                    }
                });
            }else{
                $('#formName').data('tooltip',false);
            }
        })

});

2)我在这里有两个检查,上面的代码只工作一次,而不是每次光标离开特定输入标签时,如代码中那样,即如果第二个条件被触发,然后我把它留空,它应该触发第一个函数即“名称不得为空”,而是与“长度不得大于6”一起使用

4

1 回答 1

4

我会将您的覆盖更改为这样的:

$("input#formName").each(function() {
     var $this = $(this);
     $this.on("blur",this, function(){
        var x = $this.val();
        var error;

        if (x==null || x=="") { error = "Name Must Not Be Empty"; }
        elseif (x.length < 6) { error = "Length of Name Must Br Greater than 6"; }

        $this.tooltip({
            trigger: 'manual',
            title: error
            }).on({
                blur: function() {
                    $(this).tooltip('show');
                },
                focus: function() {
                    $(this).tooltip('hide');
                }
        });
    });
});

并将所有输入更改为使用 class( .formName) 而不是 id( #formName)

于 2013-03-07T11:41:55.947 回答