zoukankan      html  css  js  c++  java
  • jQuery ScrollPagination修改之后

    jQuery ScrollPagination修改之后代码

    /*
    **    Anderson Ferminiano
    **    contato@andersonferminiano.com -- feel free to contact me for bugs or new implementations.
    **    jQuery ScrollPagination
    **    28th/March/2011
    **    http://andersonferminiano.com/jqueryscrollpagination/
    **    You may use this script for free, but keep my credits.
    **    Thank you.
    */
    
    (function( $ ){
         
        $.fn.scrollPagination = function(options) {
            var opts = $.extend($.fn.scrollPagination.defaults, options || {});
            var target = opts.scrollTarget;
            if (target == null) {
                target = obj;
            }
            opts.scrollTarget = target;
            return this.each(function() {
                $.fn.scrollPagination.init($(this), opts);
            });
        
        };
        
        $.fn.stopScrollPagination = function() {
            return this.each(function() {
                $(this).attr('scrollPagination', 'disabled');
            });
        
        };
        
        $.fn.scrollPagination.loadContent = function(obj, opts) {
            var target = opts.scrollTarget;
            var mayLoadContent = $(target).scrollTop() + opts.heightOffset >= $(document).height() - $(target).height();
            if (mayLoadContent) {
                if (opts.beforeLoad != null) {
                    opts.beforeLoad();
                }
                $(obj).children().attr('rel', 'loaded');
                $.ajax({
                    type: 'POST',
                    url: opts.contentPage,
                    data: opts.contentData,
                    beforeSend:function(){
                        if( opts.beforeSend != null ){
                            opts.beforeSend();
                        }
                    },
                    success: function(data) {
                        //call your own function to load the content
                        
                        opts.loader(data);
                        
                        /*
                        var objectsRendered = $(obj).children('[rel!=loaded]');
        
                        if (opts.afterLoad != null) {
                            opts.afterLoad(objectsRendered);
                        }
                        */
                    },
                    dataType: opts.dataType
                });
            }
        
        };
        
        $.fn.scrollPagination.init = function(obj, opts) {
            var target = opts.scrollTarget;
            $(obj).attr('scrollPagination', 'enabled');
        
            $(target).scroll(function(event) {
                if ($(obj).attr('scrollPagination') == 'enabled') {
                    $.fn.scrollPagination.loadContent(obj, opts);
                } else {
                    event.stopPropagation();
                }
            });
        
            $.fn.scrollPagination.loadContent(obj, opts);
        
        };
        
        $.fn.scrollPagination.defaults = {
            'contentPage': null,
            'contentData': {},
            'beforeLoad': null,
            'afterLoad': null,
            'scrollTarget': null,
            'heightOffset': 0,
            //Add        
            'dataType': null,
            'beforeSend':null,
            'loader': function(data) {}
        };     
    
    })( jQuery );

    调用代码

    // 定义页数
    var page = 1;
    
    $(function() {
    
        // 底部加载进度条
        var loadinghtml = '<div class="loading"><img src="__PUBLIC__/Mobile/Images/loadingxxx.gif" align="absmiddle" /></div>';
    
        $('.BookLibrarySearchList').scrollPagination({
            // 你要搜索结果的页面
            'contentPage': "{:U('Ranking/AjaxRandList',array('tag'=>$tag,'type'=>$type))}",
            // 你可以通过 children().size() 知道哪里是分页[JSON格式]
            'contentData': {
                cPage: function() {
                    return page;
                }
            },
            // 谁该怎么滚动?在这个例子中,完整的窗口
            'scrollTarget': $(window),
            // 在页面到达结束之前,从多少像素开始加载?
            'heightOffset': 50,
            // 前负荷,一些功能,可能显示一个加载DIV
            'beforeLoad': function() {
                // 翻页页数累加
                page = page + 1;
            },
            'beforeSend': function() {
                // 加载区域显示
                $('.loading').remove();
                $('.BookLibrarySearchList').append(loadinghtml);
            },
            'afterLoad': function(elementsLoaded) {
                /*
                    var i = 0;
                    if ($('#content').children().size() > 100) {
                        $('#nomoreresults').fadeIn();
                        $('#content').stopScrollPagination();
                    }
                    */
            },
            'dataType': 'JSON',
            'loader': function(data) {
    
                // 隐藏加载区域
                $('.loading').remove();
                if (data.length <= 0) {
                    $('.BookLibrarySearchList').stopScrollPagination();
    
                    $('.BookLibrarySearchList .loadingNo').remove();
                    $('.BookLibrarySearchList').append("<div class='loadingNo'>没有了!</div>");
                } else {
                    for (var i = 0; i < data.length; i++) {
                        var ChapterObj = data[i].ChapterObj;
                        var html = "";
                        html += "<div class="list">";
                        html += "    <div class="table">";
                        html += "        <table cellspacing="0" cellpadding="0" border="0" width="100%">";
                        html += "            <tr>";
                        html += "                <td rowspan="4" width="30%"><a href="" + data[i].url + "" title="" + data[i].title + "">";
                        html += "                    <img src="__PUBLIC__/" + data[i].picture + "" />";
                        html += "                </a></td>";
                        html += "                <td width="70%" class="b c">";
                        html += "                    <a href="" + data[i].url + "" title="" + data[i].title + "">" + data[i].title + "</a>";
                        html += "                    <span>" + data[i].hits + "万点击</span>";
                        html += "                </td>";
                        html += "            </tr>";
                        html += "            <tr>";
                        html += "                <td class="b">作者:" + data[i].penName + "</td>";
                        html += "            </tr>";
                        html += "            <tr>";
                        if (ChapterObj.length == 0) {
                            html += "                <td class="b">更新:暂无</td>";
                        } else {
                            html += "                <td class="b">更新:" + ChapterObj.addTime + "&nbsp;/&nbsp;" + ChapterObj.title + "</td>";
                        }
                        html += "            </tr>";
                        html += "            <tr>";
                        html += "                <td class="a b">" + data[i].jianjie + "</td>";
                        html += "            </tr>";
                        html += "        </table>";
                        html += "    </div>";
                        html += "</div>";
    
                        $('.BookLibrarySearchList').append(html);
                    }
                }
            }
        });
    
    });
  • 相关阅读:
    Django 初探--Django的开发服务器及创建数据库(笔记)
    Django初探--开发环境搭建(笔记)
    python文件处理--笔记
    python-property、docstring--笔记
    python之Lambda函数---笔记
    参数拆分-- 笔记
    python—带形状的词云图
    python—压缩文件
    python—dataframe用法
    python—mysql数据库读取表1获取name作为参数,传入访问表2获取age,结果存入excel
  • 原文地址:https://www.cnblogs.com/xiaoqian1993/p/6145188.html
Copyright © 2011-2022 走看看