chjtx / JRoll-Pulldown

JRoll的无限下载刷新扩展

JRoll下拉组件

说明

JRoll的下拉组件jroll-pulldown.js，依赖JRoll2，必须要先加载jroll.js。为了不占用太多的全局变量，该组件以JRoll原型链的一个方法形式存在，只要运行过jroll-pulldown.js即可给JRoll的实例调用。

引入

普通方式引入

<script src="jroll.js"></script>
<script src="jroll-pulldown.js"></script>

CommonJS规范引入

var JRoll = require('jroll.js');
require('jroll-pulldown.js'); //不需要赋给变量，运行就好了

var jroll = new JRoll("#wrapper");
jroll.pulldown(); //使能下拉刷新，具体配置详见下文

AMD规范引入（requireJS）

//配置jroll-pulldown依赖jroll
require.config({
    baseUrl: './',
    paths: {
        'jroll-pulldown': 'js/jroll-pulldown'
    }
    shim: {
        'jroll-pulldown': {
            deps: ['jroll'] //jroll.js的路径
        }
    }
});

define(['jroll-pulldown'], function(JRoll) {
    //jroll-pulldown将会返回JRoll，因此不需要单独引入jroll.js
    var jroll = new JRoll("#wrapper");
    jroll.pulldown(); //使能下拉刷新，具体配置详见下文
});

使用

创建JRoll实例，调用pulldown方法使能下拉刷新

var jroll = new JRoll("#wrapper");
jroll.pulldown({
    refresh: function(complete) {
        //完成加载数据的操作后回调执行complete方法
        complete();
    }
});

选项

选项	默认值	必填	说明
iconArrow	[自带箭头图片]	N	下拉过程中的箭头图标
iconLoading	[自带刷新图片]	N	刷新过程中的图标
iconFinish	[自带完成图片]	N	刷新完成后显示的图标
textPull	下拉刷新	N
textRelease	释放刷新	N
textLoading	正在加载	N
textFinish	刷新完成	N
spinning	true	N	控制刷新时是否旋转icon
refresh	null	Y	刷新过程中执行的方法，必填，且最后必须执行传给refresh的方法来复位刷新