Javascript.在当前AJAX停止后运行AJAX流

Javascript. Run a AJAX flow after current AJAX stops

本文关键字:AJAX 运行 Javascript      更新时间:2023-09-26

所以我有一个简单的javascript,当用户单击more时,它可以从数据库加载更多的注释。现在,我想扩展这个脚本,以便它在开始允许用户查看注释之前首先填充SQL数据库。我觉得我走在了正确的轨道上,但我无法让它发挥作用。

首先是执行WORK的代码。

$(function() {
$('.load_more').live("click",function() {

    var photoid = document.getElementById('photoid').value;
    var lastid = document.getElementById('lastid').value;

    if(lastid!='end'){
        $.ajax({
        type: "POST",
        url: "/more_comments_ajax.php",
        data: {
            photoid : photoid,
            lastid : lastid
        },
        beforeSend:  function() {
            $('a.load_more').html('<img src="/images/loading.gif" />');//Loading image during the Ajax Request
        },
        success: function(html){//html = the server response html code
            $("#more").remove();//Remove the div with id=more 
            $("div#updates").append(html);//Append the html returned by the server .

        }
        });
    }
    return false;
});
});

现在我觉得这应该可以像这样扩展。

$(function() {
        $.ajax({
        type: "POST",
        url: "/populate_sql.php",
        beforeSend:  function() {
            $('a.load_more').html('<img src="/images/loading.gif" />');//Loading image during the Ajax Request
        },
    sucess: $('.load_more').live("click",function() {

    var photoid = document.getElementById('photoid').value;
    var lastid = document.getElementById('lastid').value;

    if(lastid!='end'){
        $.ajax({
        type: "POST",
        url: "/more_comments_ajax.php",
        data: {
            photoid : photoid,
            lastid : lastid
        },
        beforeSend:  function() {
            $('a.load_more').html('<img src="/images/loading.gif" />');//Loading image during the Ajax Request
        },
        success: function(html){//html = the server response html code
            $("#more").remove();//Remove the div with id=more 
            $("div#updates").append(html);//Append the html returned by the server .

        }
        });
    }
    return false;
});
});
});

我在哪里丢的?

您可以使用此函数。我以前用过,效果很好。在第一个回调接收到之后,它发送第二个请求。

(function($) 
    {
        var ajaxQueue = $({});
        $.ajaxQueue = function(ajaxOpts) 
        {
            var oldComplete = ajaxOpts.complete;
            ajaxQueue.queue(function(next)
            {
                ajaxOpts.complete = function() 
                {
                    if (oldComplete) oldComplete.apply(this, arguments);
                    next();
                };
                $.ajax(ajaxOpts);
            });
        };
    })(jQuery);

像使用普通ajax一样使用它。示例:

      $.ajaxQueue({ url: 'x.php', data:{x:x,y:y}, type: 'POST', 
        success: function(respond) 
        {
            .....
        }
        });

因此,您可以检查是否有来自第一个ajax的回调,然后发送第二个请求。希望对你有所帮助。

谢谢你的回答。这并不是我所需要的,但它给了我一个想法,对我来说有效的解决方案是两个java脚本协同工作。如果有人需要类似的东西,我会把代码留在这里。

<script type="text/javascript">
jQuery(function($){
var pid = '<?php echo $ids['0']; ?>';
$.ajax({
type: "POST",
url: "/prepare_sql.php",
data: "pid="+ pid,
beforeSend:  function() {
        $('div#updates').html('<img src="/images/loading.gif" />');//Loading image during the Ajax Request
    },
    success: function(html) {
        $("div#updates").replaceWith(html);
    }
});
});
</script>

<script type="text/javascript">
$('.load_more').live("click",function() {

var photoid = document.getElementById('photoid').value;
var lastid = document.getElementById('lastid').value;

if(lastid!='end'){
    $.ajax({
    type: "POST",
    url: "/more_comments_ajax.php",
    data: {
        photoid : photoid,
        lastid : lastid
    },
    beforeSend:  function() {
        $('a.load_more').html('<img src="/images/loading.gif" />');//Loading image during the Ajax Request
    },
    success: function(html){//html = the server response html code
        $("#more").remove();//Remove the div with id=more 
        $("div#updates").append(html);//Append the html returned by the server .

    }
    });
}
return false;
});
</script>