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': ,
//Add
'dataType': null,
'beforeSend':null,
'loader': function(data) {}
}; })( jQuery );

调用代码

// 定义页数
var page = ; $(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': ,
// 前负荷,一些功能,可能显示一个加载DIV
'beforeLoad': function() {
// 翻页页数累加
page = page + ;
},
'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 <= ) {
$('.BookLibrarySearchList').stopScrollPagination(); $('.BookLibrarySearchList .loadingNo').remove();
$('.BookLibrarySearchList').append("<div class='loadingNo'>没有了!</div>");
} else {
for (var i = ; 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 == ) {
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);
}
}
}
}); });

jQuery ScrollPagination修改之后的更多相关文章

  1. jquery中修改一个元素的值或内容

    jquery中修改一个元素的值或内容,比如数值增加可以使用这个方法取得原值并+1 $this.text(function(i,ot){return Number(ot)+1;});

  2. JQuery动态修改样式

    JQuery动态修改样式 SetStyle(); function SetStyle() { $(".toolbar").remove(); $(".placeholde ...

  3. jquery无法修改网页标题,无法修改网页标题

    今天遇到一个问题,搜索时动态修改网页标题,用jquery的这段代码无效,无论FF还是IE $("title").html("new title"); 后来只好用 ...

  4. jquery uploadify修改上传的文件名和显示

    如果觉得看文章太麻烦,可以直接看参考:http://stackoverflow.com/questions/7707687/jquery-uploadify-change-file-name-as-i ...

  5. JQuery Mobile - 修改复选框的选中状态无效解决办法!

    今晚,在编写JQuery Mobile程序时候,需要在代码里面控制复选框的选中状态,很简单的代码啊,很快完成了!等测试程序时候傻眼了,页面无论如何也不按照我写的代码显示出来!问题出在哪里呢?是我写的控 ...

  6. jquery入门 修改网页背景颜色

    我们在浏览一些网站,尤其是一些小说网站的时候,都会有修改页面背景颜色的地方,这个功能使用jquery很容易实现. 效果图: show you code: <!doctype html> & ...

  7. 用Jquery实现修改页面selecte标签的默认选择

    在WEB开发中,最基础的也是用的最多的就是数据库的增删改查,修改往往以为的小部分的改动,所以我们往往是在表单中填充以前的内容然后显示给用户进行修改操作. 在填充默认内容的时候对于input标签我们往往 ...

  8. jquery操作按钮修改对应input属性

    点击右侧的修改按钮,对应的input中的disabled和readonly得属性修改 $(".buttonxg button").click(function(){ $(this) ...

  9. jquery 双击修改某项值

    双击修改某项值 $(function() { $('td.breakword').dblclick(function(){ $(this).addClass('input').html('<in ...

随机推荐

  1. 关于Java语言和面向对象记录

    本科时常用的c语言是面向过程的语言,而Java是面向对象的语言 Java语言的11个关键术语 简单性.可移植性.面向对象.分布式.高性能.解释型.健壮性.多线程.安全性.动态性.体系结构中立 面向对象 ...

  2. [moka同学笔记]八、Yii2.0课程笔记(魏曦老师教程)[授权]

    数据库表创建 在执行yii rbac/init之前,需要在 \console\controllers\RbacController.php中 <?php namespace console\co ...

  3. 一起谈谈MD5加密算法

    MD5是一个安全的散列算法,输入两个不同的明文不会得到相同的输出值,根据输出值,不能得到原始的明文,即其过程不可逆:所以要解密MD5没有现成的算法,只能用穷举法,把可能出现的明文,用MD5算法散列之后 ...

  4. js的闭包概念

    一.变量的作用域要懂得闭包,起首必须懂得Javascript特别的变量作用域.变量的作用域无非就是两种:全局变量和局部变量.Javascript说话的特别之处,就在于函数内部可以直接读取全局变量. J ...

  5. jsonp 演示实例 —— 基于node

    序 同源策略是浏览器处于安全考虑,为通信设置了"相同的域.相同的端口.相同的协议"这一限制.这让我们的ajax请求存在跨域无权限访问的问题. 同时我们发现script标签引入脚本的 ...

  6. jQuery $(document).ready()和JavaScript onload事件

    jQuery $(document).ready()和JavaScript onload事件 Why we need a right time? 对元素的操作和事件的绑定需要等待一个合适的时机,可以看 ...

  7. xcode svn commit is not under version control (1) & git commit

    使用Xcode提交一个第三方库时,由于包含资源文件,总是提交不了,提示报错:XXX commit is not under version control (1) 网上查了下,得知 xcode对于sv ...

  8. AE影视后期之跳跃音符制作

    制作跳动音符 新建项目 a.打开AE b.新建项目打开一张图片 c.新建合成将图片拖动到左下角的合成面板 新建文本图层. a.找到图层选项里面的新建text b.在里面输入IIIIIIIIIIIIII ...

  9. 【代码笔记】iOS-可以向左(右)滑动

    一,效果图. 二,代码. RootViewController.m - (void)viewDidLoad { [super viewDidLoad]; // Do any additional se ...

  10. linux 学习随笔-shell简单编写

    脚本最好都放在/usr/local/sbin中 脚本的执行 sh -x 脚本.sh -x可以查看执行过程 1在脚本中使用变量 使用变量的时候,需要使用$符号:  #!/bin/bash  ##把命令赋 ...