简单的jquery点击加载更多内容插件

简单的jquery点击加载更多内容插件

这是一款简单的jquery点击加载更多内容插件。该插件可以实现简单的通过点击按钮后超链接,来加载指定调试的内容的效果。

使用方法
在页面中引入jquery和jquery.simpleLoadMore文件。

1
2
<script src="js/jquery-1.11.0.min.js" type="text/javascript"></script>
<script src="js/jquery.simpleLoadMore.js"></script>

HTML结构
使用该插件需要的HTML结构如下。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
<div class="wrapper">
  <h1>Simple Load More - Demo</h1>
  <div class="some-list">
    <div class="item">Some List Item 1</div>
    <div class="item">Some List Item 2</div>
    <div class="item">Some List Item 3</div>
    <div class="item">Some List Item 4</div>
    <div class="item">Some List Item 5</div>
    <div class="item">Some List Item 6</div>
    <div class="item">Some List Item 7</div>
    <div class="item">Some List Item 8</div>
    <div class="item">Some List Item 9</div>
    <div class="item">Some List Item 10</div>
    ......
  </div>
</div>

初始化插件
在页面DOM元素加载完毕之后,通过下面的方法来初始化该插件。

1
2
3
4
$('.some-list').simpleLoadMore({
  item: 'div.item',
  count: 5
});
当前内容只有登录了才能查看,如果您已经注册,请登录
2

发表评论