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. Javascript 创建对象方法的总结

    最近看了一下<Javascript高级程序设计(第三版)>,这本书很多人都推荐,我也再次郑重推荐一下.看过之后总得总结一下吧,于是我选了这么一个主题分享给大家. 使用Javascript创 ...

  2. Elasticsearch配置详解、文档元数据

    目录 返回目录:http://www.cnblogs.com/hanyinglong/p/5464604.html 1.Elasticsearch配置文件详解 a. 在上面博客中,我们已经安装并且成功 ...

  3. 把普通对象转换成json格式的对象

    1.什么叫做JSON?JSON只是一种数据格式(它不是一种新的数据类型) var obj = {name: "中国", age: 5000};//->普通格式的对象 var ...

  4. c#使用json接口

    前些日子将项目由使用数据库改版为使用接口,由于接口返回的xml中多了一些附加信息,导致xml转化后的DataTable无法储存在MemCache中.这时可以将xml序列化为其对应的类,当然由于当时对x ...

  5. easyui弹出层在最顶层显示跳出iframe框架通用javascript代码

    有时候我们用easyui在后台框架中弹框的时候,总是显示在框架页面里面而不是整个系统框架的上面,看着有些不太乐意. dialog = function (opts) { var query = par ...

  6. mvc中form表单提交的几种形式

    第一种方式:submit 按钮 提交 <form action="MyDemand" method="post"> <span>关键字: ...

  7. Activity详解四 activity四种加载模式

    先看效果图: 1概述 Activity启动方式有四种,分别是: standard singleTop singleTask singleInstance 可以根据实际的需求为Activity设置对应的 ...

  8. Mac系统下Android生成keystore

    首先打开终端(在搜索里面搜索Te即可出来) 然后输入  cd /Library/Java/Home/bin/ 然后这步很关键,由于我们用的是当前用户,所以没有最高权限,不能在Library文件夹下生成 ...

  9. Xcode8开发iOS10推送通知过程

    iOS10发布后,简书优先开发增加了iOS10的新通知.本文分享整个feature的开发过程遇到的问题. 1.工程配置 Xcode8发生了很大的变化,直接打开原来的工程编译运行,这个时候是获取不到Pu ...

  10. 【代码笔记】iOS-UIView的placeholder的效果

    一,效果图. 二,工程图. 三,代码. RootViewController.h #import <UIKit/UIKit.h> @interface RootViewController ...