点击查看更多

<div class="content showMoreNChildren" pagesize="3">//调用的方法和页数
<div class="content1">
                <p class="content1-title">发送到发送到</p>
            <div class="content1-wz">

                 圆明园是我国古代造园艺术的精华,其将诗情画意融于万千变化的景象之中

                    </div>       

            </div>

</div>



(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();
}
return cnt-n;//返回还剩余的隐藏子元素的数量
}


//对页中现有的class=showMorehandle的元素,在之后添加显示更多条,并绑定点击行为
$(".showMoreNChildren").each(function () {
var pagesize = $(this).attr("pagesize") || 3;
var $children = $(this).children();
if ($children.length > pagesize) {
for (var i = pagesize; i < $children.length; i++) {
$children.eq(i).hide();
}


$("<div class='x-gd'><a href='javascript:;'>点击查看更多</a></div>").insertAfter($(this)).click(function () {
if (showMoreNChildren($children, pagesize) <= 0) {
//如果目标元素已经没有隐藏的子元素了,就隐藏“点击更多的按钮条”
$(this).hide();
};
});
}
});
})();

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值