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对象，它是原生XMLHttpRequest对象的扩展，它有一个abort方法来停止请求：

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

您需要获取AJAX成功函数.show()。

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

Answer 3

你可以试试这个：

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

Answer 4

此帖子一次代码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); });
});

停止发布活动请求

4 个答案: