(function () {
var showMoreNChildren = function ($children, n) {
//显示某jquery元素下的前n个隐藏的子元素
var $hiddenChildren = $children.filter(":hidden");
var cnt = $hiddenChildren.length;
for (var i = 0; i < n && i < cnt ; i++) {
$hiddenChildren.eq(i).show();
var temp=$hiddenChildren.eq(i).find('img');
temp.attr("src",temp.attr("_src"));
}
return cnt - n;//返回还剩余的隐藏子元素的数量
}
jQuery.showMore = function (selector) {
if (selector == undefined) { selector = ".showMoreNChildren" }
//对页中现有的class=showMorehandle的元素,在之后添加显示更多条,并绑定点击行为
$(selector).each(function () {
var pagesize = $(this).attr("pagesize") || 10;
var $children = $(this).children();
if ($children.length > pagesize) {
for (var i = pagesize; i < $children.length; i++) {
$children.eq(i).hide();
}
$("<div class='last_but showMorehandle'> <div id='btnTest'>查看更多 </div></div>").insertAfter($(this)).click(function () {

if (showMoreNChildren($children, pagesize) <= 0) {
//如果目标元素已经没有隐藏的子元素了,就隐藏“点击更多的按钮条”
$(this).hide();
};
});
}
});
}
})()

<div class="container-fluid">
<ul class="showMoreNChildren" pagesize="10">
${获取理财列表}

<li>

</li>
</ul>

</div>

jQuery 显示加载更多(节流) 实现预加载的更多相关文章

  1. Entity Framework关联查询以及数据加载(延迟加载,预加载)

    数据加载分为延迟加载和预加载 EF的关联实体加载有三种方式:Lazy Loading,Eager Loading,Explicit Loading,其中Lazy Loading和Explicit Lo ...

  2. easyui treegrid 封装(不用分页,用加载更多按钮)延迟加载加加载更多

    /** * @author wsf数据加载 */ ; var intervalId = null; (function (win,$){ $.myCache = { dataCache : {},// ...

  3. JQ封装图片预加载插件

    我们知道,图片的加载,特别是资源较大的图片,加载相当耗费时间.为了提高用户体验,不得不使用图片预加载技术来提前加载,以提高用户在浏览时的流畅度. 先来弄明白图片的懒加载和预加载的不同: 1)概念:懒加 ...

  4. JS图片预加载插件

    在开发H5项目中有时候会遇到要加载大量图片的情况,利用预加载技术可以提高用户浏览时的体验. 1)概念:懒加载也叫延迟加载:JS图片延迟加载,延迟加载图片或符合某些条件时才加载某些图片.预加载:提前加载 ...

  5. 帝国cms 加载更多的实现(父栏目以及子栏目都可以实现)

    1. <div class="pagelist"> <span id="loadmore" class="btn" sty ...

  6. Flutter 开发从 0 到 1(四)ListView 下拉加载和加载更多

    在<APP 开发从 0 到 1(三)布局与 ListView>我们完成了 ListView,这篇文章将做 ListView 下拉加载和加载更多. ListView 下拉加载 Flutter ...

  7. javascript图片懒加载与预加载的分析

    javascript图片懒加载与预加载的分析 懒加载与预加载的基本概念.  懒加载也叫延迟加载:前一篇文章有介绍:JS图片延迟加载 延迟加载图片或符合某些条件时才加载某些图片. 预加载:提前加载图片, ...

  8. 关于cocos2d-x 与 cocos2d-html5 资源预加载的思考

    移动端资源预加载,可以做到需要加载的时候,从本地磁盘加载到内存,当纹理不需要的时候,都是强制清理内存里的纹理占用: cc.TextureCache.getInstance().removeAllTex ...

  9. 预加载与智能预加载(iOS)

    来源:Draveness(@Draveness) 链接:http://www.jianshu.com/p/1519a5302141 前两次的分享分别介绍了 ASDK 对于渲染的优化以及 ASDK 中使 ...

随机推荐

  1. 1.单一职责原则(Single Responsibility Principle)

    1.定义 就一个类而言,应该仅有一个引起它变化的原因. 2.定义解读 这是六大原则中最简单的一种,通俗点说,就是不存在多个原因使得一个类发生变化,也就是一个类只负责一种职责的工作. 3.优点 类的复杂 ...

  2. Java 打印堆栈的几种方法

    国内私募机构九鼎控股打造APP,来就送 20元现金领取地址:http://jdb.jiudingcapital.com/phone.html内部邀请码:C8E245J (不写邀请码,没有现金送)国内私 ...

  3. li在IE中底部空行的BUG

    li在IE中底部空行的BUG 但是这次li在IE中底部出现的不是3像素而是一整条空白行,如图:HTML代码: <ul> <li><a href="#" ...

  4. C++在堆上申请和释放内存 - new & delete

    // 动态申请内存, 指向一个未初始化的整型 int *pi = new int; // pi指向一个整型值,初始化为0 int *pi = new int(); // value of i is 1 ...

  5. 【C语言】模拟实现库函数strcat函数

    //模拟实现库函数strcat函数 #include <stdio.h> #include <string.h> #include <assert.h> char ...

  6. 因为改 UOM conversion 导致库存数量和財务上的数据错误

    轻易改变 UOM conversion 会导致库存数量混乱, 也会造成財务上的数据错误. 我们这里做一个 case 来详细分析一下. 1. 開始 Carton 和 Each 的比例是 1 : 1. 2 ...

  7. 兼容,原来在这里就已经開始--------Day34

    看了两天,算是将w3cschool的javascript部分浏览了一遍.在脑海中大约有了一点概念,也才真切体会到:一入江湖深似海.欲穷此路难上难啊,至少如今看起来是遥遥无期.太多不懂, 太多茫然,只是 ...

  8. Android 和 PHP 之间进行数据加密传输

    Android 和 PHP 之间进行数据加密传输 [代码] [Java]代码 1 mcrypt = new MCrypt(); 2 /* Encrypt */ 3 String encrypted = ...

  9. asp.net负载均衡方案[转]

    在前面的几篇文章中,主要谈到了在Discuz!NT中的跨站缓存数据,数据库负载均衡.但如果要实现将产品分布式布置到若干机器,组成集群来共同支撑起整个业务的话,还是有一定问题的(后面会有所介绍).下面先 ...

  10. spring mvc使用的一些注意事项

    一天不进步,就是退步! 1.静态文件的处理 可以使用<mvc:resources mapping="/static/**" location="/WEB-INF/s ...