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': ,
//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 + " / " + 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修改之后的更多相关文章
- jquery中修改一个元素的值或内容
jquery中修改一个元素的值或内容,比如数值增加可以使用这个方法取得原值并+1 $this.text(function(i,ot){return Number(ot)+1;});
- JQuery动态修改样式
JQuery动态修改样式 SetStyle(); function SetStyle() { $(".toolbar").remove(); $(".placeholde ...
- jquery无法修改网页标题,无法修改网页标题
今天遇到一个问题,搜索时动态修改网页标题,用jquery的这段代码无效,无论FF还是IE $("title").html("new title"); 后来只好用 ...
- jquery uploadify修改上传的文件名和显示
如果觉得看文章太麻烦,可以直接看参考:http://stackoverflow.com/questions/7707687/jquery-uploadify-change-file-name-as-i ...
- JQuery Mobile - 修改复选框的选中状态无效解决办法!
今晚,在编写JQuery Mobile程序时候,需要在代码里面控制复选框的选中状态,很简单的代码啊,很快完成了!等测试程序时候傻眼了,页面无论如何也不按照我写的代码显示出来!问题出在哪里呢?是我写的控 ...
- jquery入门 修改网页背景颜色
我们在浏览一些网站,尤其是一些小说网站的时候,都会有修改页面背景颜色的地方,这个功能使用jquery很容易实现. 效果图: show you code: <!doctype html> & ...
- 用Jquery实现修改页面selecte标签的默认选择
在WEB开发中,最基础的也是用的最多的就是数据库的增删改查,修改往往以为的小部分的改动,所以我们往往是在表单中填充以前的内容然后显示给用户进行修改操作. 在填充默认内容的时候对于input标签我们往往 ...
- jquery操作按钮修改对应input属性
点击右侧的修改按钮,对应的input中的disabled和readonly得属性修改 $(".buttonxg button").click(function(){ $(this) ...
- jquery 双击修改某项值
双击修改某项值 $(function() { $('td.breakword').dblclick(function(){ $(this).addClass('input').html('<in ...
随机推荐
- sql执行循序
(8) select (9) distinct (11) top 1 (6) Table1.id,COUNT(Table1.name) as nameCount (1) from Table1 (3) ...
- ABP之模块
ABP的反射 为什么先讲反射,因为ABP的模块管理基本就是对所有程序集进行遍历,再筛选出AbpModule的派生类,再按照以来关系顺序加载. ABP对反射的封装着重于程序集(Assembly)与类(T ...
- POI导入导出
一.使用POI导出Execl表格 需要的jar包 package cn.yxj.poi; import java.io.FileOutputStream; import java.util.Date; ...
- JavaScript中数组去除重复
方式一:常规模式 1.构建一个新的临时数组存放结果 2.for循环中每次从原数组中取出一个元素,用这个元素循环与临时数组对比 3.若临时数组中没有该元素,则存到临时数组中 //方式一: Array.p ...
- 基础算法(javascipt)总结
一.排序: 1.选择排序: 2.交换排序: 3.插入排序 二.查找: 三.节点遍历: 四.数组去重: 时间复杂度:找出算法中的基本语句->计算基本语句的执行次数的数量级->用大O记号表示算 ...
- JavaScript基本语法(一)
前段时间学习了HTML和CSS,也实战了一些结构较简单的项目.在还没运用到JS的知识时,做出来的效果总觉得少了些什么.虽然总体布局与一些基本的特效,也能用HTML+CSS就能完成.但如今开始进入Jav ...
- SharePoint 2013 工作流之使用Visio设计篇
SharePoint 2013增强了工作流,不仅仅基于WorkFlow Foundation 4.0了,设计方式也不仅仅是Designer,还包括Visio中设计,下面我们就一个简单的例子,介绍下. ...
- iOS开发-UI 从入门到精通(一)
一.UI概述 (1)UI(User Interface)用户界面,用户能看到的各种各样的页面元素: (2)iOS App = 各种各样的UI控件+业务逻辑和算法: (3)想要开发出一款精美的应用程序, ...
- Android 缓存
1.Android缓存机制&一个缓存框架推荐 http://blog.csdn.net/shakespeare001/article/details/51695358 2.ASimpleCac ...
- va_start和va_end使用详解
本文主要介绍va_start和va_end的使用及原理. 介绍这两个宏之前先看一下C中传递函数的参数时的用法和原理: 1.在C中,当我们无法列出传递函数的所有实参的类型和数目时,可以用省略号指定参数表 ...