修改hello mui示例项目中pullrefresh_main.html中js代码后，双击顶部无法触发下拉刷新
这个是因为使用双webview下拉刷新的原因么？
i***@qq.com
- 发布：2017-09-11 12:12
- 更新：2018-11-05 09:38
- 阅读：2949
chender - 与人为善
这种问题100%是你的代码逻辑问题，只有挨个排查，以你现在贴的代码，看不出问题，贴下子页面的代码吧
-
i***@qq.com (作者)
这个是官方hello mui 的示例项目没有改动，只有修改pullrefresh_main.html中的contentWebview.evalJS("mui('#pullrefresh').pullRefresh().scrollTo(0,0,100)");为contentWebview.evalJS("mui('#pullrefresh').pullRefresh().scrollTo(0,0,100);mui('#pullrefresh').pullRefresh().pulldownLoading();");
2017-09-11 13:53
-
-
-
i***@qq.com (作者)
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Hello MUI</title>
<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<link rel="stylesheet" href="../css/mui.min.css">
</head>
<body>
<!--下拉刷新容器-->
<div id="pullrefresh" class="mui-content mui-scroll-wrapper">
<div class="mui-scroll">
<!--数据列表-->
<ul class="mui-table-view mui-table-view-chevron">
<li class="mui-table-view-cell">
<a href="" class="mui-navigate-right">Item 1</a>
</li>
<li class="mui-table-view-cell">
<a href="" class="mui-navigate-right">Item 2</a>
</li>
<li class="mui-table-view-cell">
<a href="" class="mui-navigate-right">Item 3</a>
</li>
<li class="mui-table-view-cell">
<a href="" class="mui-navigate-right">Item 4</a>
</li>
<li class="mui-table-view-cell">
<a href="" class="mui-navigate-right">Item 5</a>
</li>
</ul>
</div>
</div>
<script src="../js/mui.min.js"></script>
<script>
mui.init({
pullRefresh: {
container: '#pullrefresh',
down: {
callback: pulldownRefresh
},
up: {
contentrefresh: '正在加载...',
callback: pullupRefresh
}
}
});
/**
* 下拉刷新具体业务实现
*/
function pulldownRefresh() {
setTimeout(function() {
var table = document.body.querySelector('.mui-table-view');
var cells = document.body.querySelectorAll('.mui-table-view-cell');
for (var i = cells.length, len = i + 3; i < len; i++) {
var li = document.createElement('li');
li.className = 'mui-table-view-cell';
li.innerHTML = '<a class="mui-navigate-right">Item ' + (i + 1) + '</a>';
//下拉刷新，新纪录插到最前面；
table.insertBefore(li, table.firstChild);
}
mui('#pullrefresh').pullRefresh().endPulldownToRefresh(); //refresh completed
}, 1500);
}
var count = 0;
/**
* 上拉加载具体业务实现
*/
function pullupRefresh() {
setTimeout(function() {
mui('#pullrefresh').pullRefresh().endPullupToRefresh((++count > 2)); //参数为true代表没有更多数据了。
var table = document.body.querySelector('.mui-table-view');
var cells = document.body.querySelectorAll('.mui-table-view-cell');
for (var i = cells.length, len = i + 5; i < len; i++) {
var li = document.createElement('li');
li.className = 'mui-table-view-cell';
li.innerHTML = '<a class="mui-navigate-right">Item ' + (i + 1) + '</a>';
table.appendChild(li);
}
}, 1500);
}
// if (mui.os.plus) {
// mui.plusReady(function() {
// setTimeout(function() {
// mui('#pullrefresh').pullRefresh().pullupLoading();
// }, 10);
//
// });
// } else {
// mui.ready(function() {
// mui('#pullrefresh').pullRefresh().pullupLoading();
// });
// }
</script>
</body>
</html>
<!--这是子页面的代码-->
2017-09-11 13:59
-
你把mui('#pullrefresh').pullRefresh().scrollTo(0,0,100)去掉看有没有问题，难道是scrollTo和pulldownLoading连续调会出问题？
2017-09-11 15:05
-
wenju - https://www.mescroll.com -- 精致的下拉刷新和上拉加载组件
谢邀~
可惜我没法正面回答您的问题哈
因为 我用的下拉刷新是自己写的 https://github.com/mescroll/mescroll
您不介意可以尝试使用
当然关于mui的,其实不是复杂的列表可以用官方的单Webview呀,双Webview比较麻烦哦
