layui之初始化加分页重复请求问题解决

 1 //基于JQuery的baseJqAjax
 2 function baseJqAjax ( options , error , success ) {
 3 
 4     options = options === undefined ? {} : options;
 5 
 6     var type = options.type === undefined ? 'post' : options.type;
 7 
 8     var async =options.async === undefined ? true : options.async;
 9 
10     var url = options.url === undefined ? '' : options.url;
11 
12     var data = options.data === undefined ? {} : options.data;
13 
14     var dataType =options.dataType === undefined ? 'json' : options.dataType;
15 
16     $.ajax({
17 
18         type: type,
19 
20         async: async,
21 
22         url: url,
23 
24         data: data,
25 
26         dataType: dataType,
27 
28         error: function(err) { error&&error(err); },
29 
30         success: function(result) { success&&success(result); }
31 
32     });
33 
34 }
35 /*使用方法有两种*/
36 
37 //第一种逻辑较多的选择  其他参数不设置使用默认参数
38 
39 baseJqAjax({url:url,data:data},error,success);
40 
41 function error(err){
42 
43     //请求失败执行的代码
44 }
45 
46 function success(result){
47     
48     //请求成功后执行的代码
49 }
50 
51 //第二种适合业务逻辑较少 其他参数不设置使用默认参数
52 //
53 baseJqAjax({url:url,data:data},function error(err){
54 
55     //请求失败执行的代码
56     
57 },function success(result){
58 
59     //请求成功后执行的代码
60     
61 });

 1 //init和page 里的接口都是同一个
 2 function init(){
 3 
 4     baseJqAjax({url:url,data:data},function error(err){
 5 
 6         //请求失败执行的代码
 7 
 8     },function success(result){
 9 
10         //请求成功后执行的代码
11         //成功请求到数据result
12         var data=result.data;
13         var page=result.count;
14         page(data,page);
15     });
16 }
17 
18 function page(data,page){
19 
20     layui.use('laypage', function(){
21 
22         var laypage = layui.laypage;
23 
24         laypage.render({
25 
26             elem: 'free',//注意，这里的 test1 是 ID，不用加 # 号
27 
28             count: page,
29 
30             groups:2, //数据总数，从服务端得到
31 
32             limit:2,    //每页的条数在这里设置
33 
34             jump: function(data, first){
35 
36                 //page
37 
38                 if(!first){
39 
40                    baseJqAjax({url:url,data:data},error,success);
41 
42                     function error(err){
43                         //分页请求失败执行的代码
44                     }
45 
46                     function success(result){
47                         //分页请求成功后执行的代码
48                     }
49                 } else {
50 
51                     //init
52 
53                      var html='';
54 
55                     for(var i=0;i<data.length;i++){
56 
57                         html += '<li>'+ data[i].parkingLotName + '</li>';
58 
59                     }
60 
61                     $('#ul').html(html);
62 
63                 }
64             }
65         });
66     });
67 }