×

jquery

关于一个页面请求多个AJAX的分步执行代码

天外来信 天外来信 发表于2013-08-16 14:47:09 浏览4676 评论0

抢沙发发表评论

当一个页面打开需要执行30多个ajax进程去获取资料时,就得考虑这么多个请求是否会把服务器压跨。
因此改进了一下ajax 的请求代码,保证每次只执行一条ajax进程,以免拖死服务器,
代码参考了http://www.dotblogs.com.tw/wadehuang36/archive/2010/06/04/jquery_ajax_queue.aspx  这篇文章。

这篇文章写得相当好。我用的代码也是从他里里来的。
html代码:thinkphp 的模板代码
<volist name="row" id="v">
   <div val="{$v.id}" class="ajax tr" url="__APP__/Ajax/getpd" func="showtr"><INPUT TYPE="hidden" NAME="id" value="{$v.id}">
  </div>
</volist>


JS代码
 $.originAjax = $.ajax;
$.ajax = function (option) {
    //因為是非同步的,我用二個Queue,一個記錄執行,一個記錄完成。
    var oldComplete = option.complete;
    option.complete = function () {
        if (oldComplete) oldComplete.apply(this, arguments);
        $.dequeue($.ajax, "ajaxDown");
    };
    $([$.ajax]).queue("ajax", function () {
        $.originAjax(option);
    });
    $([$.ajax]).queue("ajaxDown", function () {
        $.dequeue($.ajax, "ajax");
    });    
    var q = $([$.ajax]).queue("ajaxDown");
    if (q.length == 1) {
        $.dequeue($.ajax, "ajax");
    } 
}; 
function showtr(obj,json)
{
obj.html(json);
} 
$(document).ready(function(){
$('.ajax').each(function(){
var obj=$(this);
url=obj.attr('url');
val=obj.attr('val');
$.ajax({url:url,dataType:'json',data:'val='+val,success:function(json){
eval(obj.attr('func')+'(obj,json)');
}});
/*
$.getJSON(url,{val:val},function(json){
eval(obj.attr('func')+'(obj,json)');
});*/
});
});

评论列表

访客