点击加载更多

 $(function () {

        /*初始化*/
        var counter = 0;
        /*计数器*/
        var pageStart = 0;
        /*offset*/
        var pageSize = 4;
        /*size*/
        /*首次加载*/
        getData(pageStart, pageSize);
        /*监听加载更多*/
        $(document).on('click', '#showMore', function () {
            counter++;
            pageStart = counter * pageSize;
            getData(pageStart, pageSize);
        });
    });
    function getData(offset, size) {
        $.ajax({
            type: 'GET',
            url: 'msg.json',
            dataType: 'json',
            success: function (reponse) {
                var data = reponse.list;
                var sum = reponse.list.length;
                var result = '';
                if (sum - offset < size) {
                    size = sum - offset;
                }
                /*使用for循环模拟SQL里的limit(offset,size)*/
                for (var i = offset; i < (offset + size); i++) {
                    result += '<ul id="" class="mg-coupon">' +
                        '<li> <span class="mg-time" style="width:225px;margin-left:230px">2017-04-01 10:22:30</span>' +
                        '<div class="mg-box">' +
                        '<div class="mg-title">' +
                        '<h5 style="float: left">订单即将关闭</h5>' +
                        '<s class="delMsg" style="cursor:pointer" onclick="logicDeleteMessage()"></s>' +
                        '</div>' +
                        '<div class="mg-content clearfix">' +
                        '<div>您有一笔终端订单即将关闭，请及时完成支付，避免不必要的损失!</div>' +
                        '<a target="_blank" href="" class="mg-details">查看详情&nbsp;&gt;&nbsp;</a>' +
                        '</div> </div> </li> </ul>';
                }
                $(".mg-more").before(result);

                /*******************************************/

                /*隐藏more按钮*/
                if ((offset + size) >= sum) {
                    $("#showMore").text('已经没有更多的消息了');
                } else {
                    $("#showMore").show();
                }
            },
            error: function (xhr, type) {
                alert('Ajax error!');
            }
        });
    }