下拉滚动加载更多数据

 1 KISSY.add(‘load‘,function(S,Core,IO,XTemplate){
 2     var $ = S.all, D = S.DOM, E = S.Event;
 3     var API = {
 4         ‘query‘:‘query.do‘
 5     };
 6     var tpl = ‘{{#each result}}‘+
 7             ‘<tr>‘+
 8                 ‘<td><input type="checkbox" name="fileCheck" class="J_FileCheck" value="{{fileId}}" data-idx="{{xindex}}"/> </td>‘+
 9                 ‘<td>{{fileName}} <span class="btnLabel J_FilePreview">预览</span> </td>‘+
10                 ‘<td>{{length}}K</td>‘+
11                 ‘<td>{{modifyTime}}</td>‘+
12                 ‘<td><span class="btnLabel J_FileDownload">下载</span>‘ +
13                 ‘</td>‘ +
14             ‘</tr>‘ +
15             ‘{{/each}}‘;
16 
17     var X = {
18         init:function(){
19             this.box = $(‘.J_FileTable‘);
20             this.currentPage = 1;
21             this.loading = false;   
22             this.loadTimer = null; //定时器是为了防止滚动过程中，不断的发请求
23 
24             this._queryFile();
25             this.bindDialog();
26         },
27         bindDialog :function(){
28             var self = this;
29             self.box.on(‘scroll‘,function(e){
30                 var container = $(this);
31                 self.loadTimer && clearTimeout(self.loadTimer);
32                 //定时器是为了防止滚动过程中，不断的发请求
33                 self.loadTimer = setTimeout(function(){
34                 //如果请求发出还没有回来时，就先不发送下个请求                    
35                     if(!self.loading){
36                         var obj = self.box.one(‘table‘);
37                         if(obj.height() <= container.scrollTop() + container.height()){
38                             self._queryFile();
39                         }
40                     }
41                 },100);
42             })
43         },
44         _queryFile:function(){
45             var self = this;
46             self.loading = true;
47             IO({
48                 url: API.query,
49                 data: {
50                     page: self.currentPage
51                 },
52                 type: ‘get‘,
53                 dataType: ‘json‘,
54                 success: function (data) {
55                     if(data && data.result && data.result.length>0){
56                         var html = new XTemplate(tpl).render( data);
57                         if(self.currentPage<2){
58                             self.box.all(‘.J_FTBody‘).html(html);
59                         }else{
60                             self.box.all(‘.J_FTBody‘).append(html);
61                         }
62                         self.currentPage +=1;
63                     }else{
64                         self.box.all(‘.J_FTBody‘).html(‘还没有附件，请先添加‘);
65                     }
66 
67                     self.loading = false; //加载完成
68                 },
69                 error:function(data){
70                     self.loading = false; //加载完成
71                 }
72             });
73 
74         }
75 
76     };
77 
78     return X;
79 },{
80     requires: [
81         ‘core‘,
82         ‘io‘,
83         ‘xtemplate‘
84     ]
85 });