{"id":13396799,"url":"https://github.com/ximan/dropload","last_synced_at":"2025-05-15T05:07:44.232Z","repository":{"id":22302084,"uuid":"25637001","full_name":"ximan/dropload","owner":"ximan","description":"移动端下拉刷新、上拉加载更多插件","archived":false,"fork":false,"pushed_at":"2018-09-29T06:30:32.000Z","size":145,"stargazers_count":2712,"open_issues_count":101,"forks_count":1130,"subscribers_count":164,"default_branch":"gh-pages","last_synced_at":"2025-04-14T12:58:27.573Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"","language":null,"has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/ximan.png","metadata":{"files":{"readme":"README.md","changelog":"Changelog.md","contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2014-10-23T12:57:37.000Z","updated_at":"2025-04-10T09:19:09.000Z","dependencies_parsed_at":"2022-08-21T02:00:36.828Z","dependency_job_id":null,"html_url":"https://github.com/ximan/dropload","commit_stats":null,"previous_names":[],"tags_count":9,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ximan%2Fdropload","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ximan%2Fdropload/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ximan%2Fdropload/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ximan%2Fdropload/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/ximan","download_url":"https://codeload.github.com/ximan/dropload/tar.gz/refs/heads/gh-pages","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":254149987,"owners_count":22022853,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-07-30T18:01:03.454Z","updated_at":"2025-05-15T05:07:39.211Z","avatar_url":"https://github.com/ximan.png","language":null,"readme":"# dropload\na javascript implementation of pull to refresh and up to loadmore\n\u003cbr /\u003e\n移动端下拉刷新、上拉加载更多插件\n\n## 背景介绍 (introduce)\n\n感谢交流群和github上的网友反馈和建议，修复两个bug。并且把某些demo里ajax获取数据部分从原来的假json改为真正的数据接口，让例子更接近线上开发环境。\n\n[历史背景介绍](Intro.md)\n\n## 最新版本 (The latest version)\n\n### 0.9.1(161205)\n\n* 修复不调用loadDownFn报错bug\n* 修复窗口改变resize未触发加载数据bug\n\n[所有更新日志](Changelog.md)\n\n## 示例 (demo)\n\n![扫一扫](examples/load-bottom.png)\n[DEMO1，加载底部(loadmore)](http://ximan.github.io/dropload/examples/load-bottom.html)\n\n![扫一扫](examples/load-top-bottom.png)\n[DEMO2，加载顶部、底部(refresh \u0026 loadmore)](http://ximan.github.io/dropload/examples/load-top-bottom.html)\n\n![扫一扫](examples/product-list.png)\n[DEMO3，特殊布局，加载顶部、底部(refresh \u0026 loadmore with fixed navbar)](http://ximan.github.io/dropload/examples/product-list.html)\n\n![扫一扫](examples/multiple-load.png)\n[DEMO4，按需加载](http://ximan.github.io/dropload/examples/multiple-load.html)\n\n![扫一扫](examples/tab.png)\n[DEMO5，tab加载数据](http://ximan.github.io/dropload/examples/tab.html)\n\n## 依赖 (dependence)\n\nZepto 或者 jQuery 1.7以上版本，推荐jQuery 2.x版本（二者不要同时引用）\n\u003cbr /\u003e\nZepto or jQuery 1.7+，recommend to use jQuery 2.x（not use them at the same time）\n\n## 使用方法 (usage)\n\n引用css和js\n\u003cbr /\u003e\n(basic)\n\n    \u003clink rel=\"stylesheet\" href=\"../dist/dropload.css\"\u003e\n    \u003cscript src=\"../dist/dropload.min.js\"\u003e\u003c/script\u003e\n\n````\n$('.element').dropload({\n    scrollArea : window,\n    loadDownFn : function(me){\n        $.ajax({\n            type: 'GET',\n            url: 'json/more.json',\n            dataType: 'json',\n            success: function(data){\n                alert(data);\n                // 每次数据加载完，必须重置\n                me.resetload();\n            },\n            error: function(xhr, type){\n                alert('Ajax error!');\n                // 即使加载出错，也得重置\n                me.resetload();\n            }\n        });\n    }\n});\n````\n（注明：所有示例里`ajax`和`setTimeout`都是为了模拟加载效果而写的，与本插件无直接关系。`ajax`建议自己写，无特殊情况不必copy我的`ajax`写法，因为写得太烂。如需下载本地运行，请在本机装服务器环境，否则`ajax`会报错。）\n\n## 参数列表 (options)\n\n|    参数     |     说明     |  默认值 |      可填值     |\n|------------|-------------|--------|----------------|\n| scrollArea | 滑动区域      | 绑定元素自身 | window |\n| domUp      | 上方DOM      | {\u003cbr/\u003edomClass : 'dropload-up',\u003cbr/\u003edomRefresh : '\u0026lt;div class=\"dropload-refresh\"\u0026gt;↓下拉刷新\u0026lt;/div\u0026gt;',\u003cbr/\u003edomUpdate  : '\u0026lt;div class=\"dropload-update\"\u0026gt;↑释放更新\u0026lt;/div\u0026gt;',\u003cbr/\u003edomLoad : '\u0026lt;div class=\"dropload-load\"\u0026gt;○加载中...\u0026lt;/div\u0026gt;'\u003cbr/\u003e} | 数组 |\n| domDown    | 下方DOM      | {\u003cbr/\u003edomClass : 'dropload-down',\u003cbr/\u003edomRefresh : '\u0026lt;div class=\"dropload-refresh\"\u0026gt;↑上拉加载更多\u0026lt;/div\u0026gt;',\u003cbr/\u003edomLoad : '\u0026lt;div class=\"dropload-load\"\u0026gt;○加载中...\u0026lt;/div\u0026gt;',\u003cbr/\u003edomNoData : '\u0026lt;div class=\"dropload-noData\"\u0026gt;暂无数据\u0026lt;/div\u0026gt;'\u003cbr/\u003e}  | 数组 |\n| autoLoad   | 自动加载      | true | true和false |\n| distance   | 拉动距离      | 50 | 数字 |\n| threshold  | 提前加载距离   | 加载区高度2/3 | 正整数 |\n| loadUpFn   | 上方function | 空  | function(me){\u003cbr/\u003e//你的代码\u003cbr/\u003eme.resetload();\u003cbr/\u003e} |\n| loadDownFn | 下方function | 空  | function(me){\u003cbr/\u003e//你的代码\u003cbr/\u003eme.resetload();\u003cbr/\u003e} |\n\n## API\n\n暴露一些功能，可以让dropload更灵活的使用\n\n`lock()` 锁定dropload\n\n|      参数      |             说明            |\n|----------------|----------------------------|\n| `lock()`       | 智能锁定，锁定上一次加载的方向 |\n| `lock('up')`   | 锁定上方                    |\n| `lock('down')` | 锁定下方                    |\n\n`unlock()` 解锁dropload\n\n`noData()` 无数据\n\n|      参数      |             说明            |\n|----------------|----------------------------|\n| `noData()`     |           无数据            |\n| `noData(true)` |           无数据            |\n| `noData(false)`|           有数据            |\n\n`resetload()` 重置。每次数据加载完，必须重置\n\n## 已知问题\n\n* 由于部分Android中UC和QQ浏览器头部有地址栏，并且一开始滑动页面隐藏地址栏时，无法触发scroll和resize，所以会导致部分情况无法使用。解决方案1：增加distance距离，例如DEMO2中distance:50；解决方案2：加`meta`使之全屏显示\n````\n\u003cmeta name=\"full-screen\" content=\"yes\"\u003e\n\u003cmeta name=\"x5-fullscreen\" content=\"true\"\u003e\n````\n例如DEMO1\n\n## dropload使用交流群\n\n[群号：290725368，点击加群](http://shang.qq.com/wpa/qunwpa?idkey=2c58606fdfb5d6be4021a678e1506fdbbbc480aabdca0eeb115c2f4ff5bc69ee)\n","funding_links":[],"categories":["移动端","Dropload","miscellaneous","UI"],"sub_categories":["Web DB","其它"],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fximan%2Fdropload","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fximan%2Fdropload","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fximan%2Fdropload/lists"}