下拉加载请求数据实现

@@ -16,6 +16,8 @@ require('lazyload');
 exports.init = function() {
     $(function() {
         var $intro = $('#intro'),
+            $infoContent = $('#info-content'),
+            dataEnd = false,
             tpl;
 
         //获取相关资讯模板
@@ -54,6 +56,44 @@ exports.init = function() {
         });
 
         //下拉加载更多
+        $(window).scroll(function() {
+            var count;
+            if ($(window).scrollTop() + $(window).height() >= $(document).height()) {
+                //loadData
+                if (dataEnd) {
+                    //下次下拉时不显示加载图片以及不加载数据
+                } else {
+                    count = $infoContent.children('.info-block').length;
+                    $.ajax({
+                        type: 'GET',
+                        url: '/ps/loadInfo',
+                        data: {
+                            start: count
+                        }
+                    }).then(function(data) {
+                        var html = '',
+                            res,
+                            i;
+                        if (data.success) {
+                            if (data.end) {
+                                dataEnd = true;
+                            }
+                            res = data.data;
+                            for (i = 0; i < res.length; i++) {
+                                html += Mustache.render(tpl, res[i]);
+                            }
+                            if (html !== '') {
+                                $infoContent.append(html);
 
+                                //lazyload 不包含src即未加载的图片
+                                $('img.lazy:not([src])').lazyload({
+                                    container: $infoContent
+                                });
+                            }
+                        }
+                    });
+                }
+            }
+        });
     });
 };
\ No newline at end of file

@@ -15,4 +15,5 @@ module.exports = function(app) {
 
     app.get('/ps', ps.show); //plus + star
     app.get('/ps/readTpl', ps.readTpl); //获取相关资讯模板
+    app.get('/ps/loadInfo', ps.loadInfo); //加载相关资讯数据
 };
\ No newline at end of file

@@ -4,6 +4,7 @@
  * @date: 2015/4/15
  */
 var data = require('../../public/js/data')('ps'),
+    dataInfos = require('../../public/js/data')('dataInfo'),
     path = require('path'),
     fs = require('fs'),
     tplPath = path.normalize(path.join(__dirname, '../partials/ps/info-item.html'));
@@ -20,11 +21,34 @@ exports.show = function(req, res) {
 exports.readTpl = function(req, res) {
     fs.readFile(tplPath, 'utf8', function(err, data) {
         if (err) {
-            res.send({success: false})
+            res.send({success: false});
         }
+
+        fs.readFile(
+            path.normalize(path.join(__dirname, '../partials/common/time-view-like-share.html')),
+            'utf8', function(err, subData) {
+            if (err) {
+                res.send({success: false});
+            }
+            data = data.replace('{{> common/time_view_like_share}}', subData); //Note: 后端需将partials目录替换为内容
             res.send({
                 success: true,
                 data: data
             });
         });
+    });
 };
+
+exports.loadInfo = function(req, res) {
+    var start = 1 * req.query.start,
+        count = 3,
+        end = false;
+    if (start + count >= dataInfos.length) {
+        end = true;
+    }
+    res.send({
+        success: true,
+        end: end,
+        data: dataInfos.slice(start, start + count)
+    });
+}
\ No newline at end of file

@@ -42,7 +42,7 @@
             <div class="info-title-container">
                 <h2 class="info-title">相关文章</div>
             </div>
-            <div class="info-content">
+            <div id="info-content" class="info-content">
                 {{# info}}
                     {{> ps/info_item}}
                 {{/ info}}