0

ここで深刻なジレンマに直面しています。フォーム検証のために入力タグにブートストラップ ツールチップを使用しました。つまり、フォーム検証エラーが発生すると、入力タグの周りにツールチップが自動的に表示されます。問題は

1) ツールチップは、onBlur が 2 回目に呼び出されたときにのみ表示またはトリガーされますが、最初にカーソルが入力タグを離れたときに表示されるはずでしたが、コードは次のとおりです。

$("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)ここに2つのチェックがあります。上記のコードは、カーソルがコードのように特定の入力タグを離れるたびにではなく、1回だけ機能します。つまり、2番目の条件がトリガーされた後、空のままにしておくと、最初の条件がトリガーされますfunction ie "name Must not be empty" ではなく、"Length must not be greater than 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');
                }
        });
    });
});

.formNameそして、id()の代わりにclass()#formNameを使用するようにすべての入力を変更します

于 2013-03-07T11:41:55.947 に答える