<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
<title>test</title>
<link href="../css/mui.css" rel="stylesheet"/>
</head>
<body>
<!--下拉刷新容器-->
<div id="pullrefresh" class="mui-content mui-scroll-wrapper">
<div class="mui-scroll">
<!--数据列表-->
<ul class="mui-table-view mui-table-view-chevron">
</ul>
</div>
</div>
<script src="../js/mui.min.js"></script>
<script>
mui.init({
swipeBack: false,
pullRefresh: {
container: '#pullrefresh',
down: {
callback: pulldownRefresh
}
}
});
/**
* 下拉刷新具体业务实现
*/
var last=-5,amount=5;
function pulldownRefresh() {
last =last+amount;
var table = document.body.querySelector('.mui-table-view');
var cells = document.body.querySelectorAll('.mui-table-view-cell');
mui.ajax({
type: "post",
dataType: "json",
url: "http://www.com/ajaxjson.php",
data: "last="+last+"&amount="+amount,
complete :function(){$("#load").hide();},
success: function(msg){
var data = msg;
var tmp='';
$.each(data, function(i, n){
var li = document.createElement('li');
li.className = 'mui-table-view-cell';
li.innerHTML = '<a class="mui-navigate-right">' + n.itemname + '</a>';
//下拉刷新,新纪录插到最前面;
table.insertBefore(li, table.firstChild);
});
}
});
mui('#pullrefresh').pullRefresh().endPulldownToRefresh(); //refresh completed
}
//如果去掉以下注释 ,则提示 Cannot read property 'classList' of undefined at js/mui.min.js:6
/*
if (mui.os.plus) {
mui.plusReady(function() {
setTimeout(function() {
mui('#pullrefresh').pullRefresh().pullupLoading();
}, 1000);
});
} else {
mui.ready(function() {
mui('#pullrefresh').pullRefresh().pullupLoading();
});
}
*/
</script>
</body>
</html>
ajaxjson.php
<?php
$data=array('last'=>23,'amount'=>324);
echo json_encode($data);
?>
以上代码 下拉时,没任何反应.是哪里出问题了呢?
0 个回复