Question

现在，每当用户切换“评论（X）”

时，它就会联系服务器

我希望只要用户点击“.info .reply”（评论（X））就会这样做，一个ajax加载器就会出现，直到数据加载完毕，然后加载器消失。

// Replies - Toggle display of comments
$('.info .reply').click( function() {
    $('.reply', this.parentNode.parentNode).toggle();
    return false;
});

// Load comments
$('.info .reply', this).mousedown( function() {
    var id = $('form #id', this.parentNode.parentNode).val();
    $.ajax({ url: location.href, type: 'post', data: 'id=' + id, dataType: 'json',
        success: function(data) {
            for (var i in data) {
                // Do AJAX Updates
            }
        }
    });
    return false;
});

这样做的正确方法是什么？

谢谢！

Answer 1

<强>基本上

使用show（）或fadeIn（）显示mousedown上的图像或者您喜欢的任何痒痒，然后将其隐藏在成功回调中。 喜欢这个

$('.info .reply', this).mousedown( function() {
    $("#loading-image").show(); // Show the progress indicator
    var id = $('form #id', this.parentNode.parentNode).val();
    $.ajax({ url: location.href, type: 'post', data: 'id=' + id, dataType: 'json',
        success: function(data) {
            $("#loading-image").hide(); // Hide the progress indicator
            for (var i in data) {
                // Do AJAX Updates
            }
        }
    });
    return false;
});

Answer 2

您可以使用jQuery BlockUI等插件执行此操作。在致电$.blockUI()之前，请致电$.ajax。然后在success事件结束时，请致电$.unblockUI()。

在ajax查询完成之前显示加载图像的好方法是什么？

2 个答案: