jquery - イベントで投稿リクエストを停止

Question

ajax から読み込まれたデータのツールチップがあります。

$('.show_tooltip').hover(
    function(){
        $.post('getdata.php', function(data)    {
            $('#tooltip').html(data);
            $('#tooltip').show()
        });
    },
    function(){
        $('#tooltip').hide(); 
    }
);

できます。
しかし、問題は、要素の上にカーソルを置いてマウスをすばやく移動すると、$('#tooltip').show()効果がなく、hide(). しかし、データが読み込まれると、ポップアップ表示され、ホバーなしで表示されたままになります。

それについて何ができるか。投稿リクエストを完全に停止する方法はありますか?

Answer 1

jQuery AJAX メソッドは、リクエストを停止するメソッドを持つネイティブ オブジェクトjqXHRの拡張であるオブジェクトを返します。XMLHttpRequestabort

var xhr;
$('.show_tooltip').hover(
    function(){
        //Save reference to the jqXHR object
        xhr = $.post('getdata.php', function(data) {
            $('#tooltip').html(data);
            $('#tooltip').show()
        });
    },
    function(){
        xhr.abort(); //Abort the request
        $('#tooltip').hide(); 
    }
);

Answer 2

あなたはこれを試すことができます：

$('.show_tooltip').hover(
    function(){
        $.post('getdata.php', function(data)    {
            $('#tooltip').html(data);
            $('#tooltip').show()
        });
    }
);
$('#tooltip').bind("mouseleave", function(){
    $(this).hide();
});

Answer 3

この投稿は一度コードevent.preventDefault(); 例:

$("#formName").submit(function(event) {
    event.preventDefault(); // here using code stop post (return false;)
    $.post('processing.php', $("#formName").serialize(), function(result){ $('#LimitlessDiv').html(result); });
});

Answer 4

.show()AJAX 成功関数を利用する必要があります。

$('.show_tooltip').hover(
    function(){
        $.ajax({
            type: 'POST',
            url: 'getdata.php',
            asynch
            data: data,
            success: function(){
                $('#tooltip').html(data);
            }
            $('#tooltip').show()
        });
    },
    function(){
        $('#tooltip').hide(); 
    }
);