* {
margin: 0;
padding: 0;
-webkit-touch-callout: none;
-webkit-user-select: none;
-webkit-tap-highlight-color: transparent;
}
body {
background-color: white
}
ul {
list-style-type: none
}
a {
text-decoration: none;
color: #18B4FE;
}
/*模拟的标题*/
.header {
z-index: 9990;
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 44px;
line-height: 44px;
text-align: center;
border-bottom: 1px solid #eee;
background-color: white;
}
.header .btn-left {
position: absolute;
top: 0;
left: 0;
padding: 12px;
line-height: 22px;
}
.header .btn-right {
position: absolute;
top: 0;
right: 0;
padding: 0 12px;
}
/*说明*/
.mescroll .notice {
font-size: 14px;
padding: 20px 0;
border-bottom: 1px solid #eee;
text-align: center;
color: #555;
}
/*列表*/
.mescroll {
position: fixed;
top: 44px;
bottom: 0;
height: auto;
}
/*展示上拉加载的数据列表*/
.news-list li {
padding: 16px;
border-bottom: 1px solid #eee;
}
.news-list .new-content {
font-size: 14px;
margin-top: 6px;
margin-left: 10px;
color: #666;
}
下拉刷新: 添加新数据到列表顶部
$(function () {
var mescroll = new MeScroll("mescroll", { //第一个参数"mescroll"对应上面布局结构div的id
//如果您的下拉刷新是重置列表数据,那么down完全可以不用配置,具体用法参考第一个基础案例
//解析: down.callback默认调用mescroll.resetUpScroll(),而resetUpScroll会将page.num=1,再触发up.callback
down: {
callback: downCallback //下拉刷新的回调
},
up: {
auto: true,
page: {
num: 0,
size: 15,
time: null
},
callback: upCallback //上拉加载的回调
}
});
//下拉刷新的回调
function downCallback() {
$.ajax({
url: 'test.php',
success: function (data) {
//联网成功的回调,隐藏下拉刷新的状态;
mescroll.endSuccess(); //无参
//设置数据
//setXxxx(data);//自行实现 TODO
},
error: function (data) {
//联网失败的回调,隐藏下拉刷新的状态
mescroll.endErr();
}
});
}
//上拉加载的回调 page = {num:1, size:10}; num:当前页 默认从1开始, size:每页数据条数,默认10
function upCallback(page) {
$.ajax({
url: 'test.php?page=' + page.num + "&size=" + page.size,
success: function (data) {
//联网成功的回调,隐藏下拉刷新和上拉加载的状态;
//参数data.length:当前页的数据总数
//mescroll会根据data.length自动判断列表如果无任何数据,则提示空,显示empty配置的内容;
//列表如果无下一页数据,则提示无更多数据;
//如果不传data.length,则仅隐藏下拉刷新和上拉加载的状态
var jsondata = eval('(' + data + ')');
var data = jsondata.data;
mescroll.endSuccess(data.length);
//设置列表数据
//setListData(data);//自行实现 TODO
for (var i = 0; i < data.length; i++) {
$("#newsList").append('
' + jsondata.data[i].student_name + '');}
},
error: function (e) {
//联网失败的回调,隐藏下拉刷新和上拉加载的状态
mescroll.endErr();
}
});
}
});
/**
* Created by 小雨在线.
* User: 飛天
* Date: 2017/8/25 0025
* Time: 14:13
*/
define("HOST", "xxxx"); //主机名
define("USER", "yyyyy"); //账号
define("PASS", "aaaaa"); //密码
define("DBNAME", "dddd-database"); //数据库名
$conn = new mysqli(HOST, USER, PASS);
$conn->select_db(DBNAME);
//当前页
$page = $_GET["page"] ? $_GET["page"] : 1;
//每页显示条数
$num = $_GET["size"] ? $_GET["size"] : 10;
//偏移量
$ofset = ($page - 1) * $num;
//$t_sql = "SELECT student_name,course_name,mobile FROM edu_trxorder WHERE trx_status='SUCCESS'";
$t_sql = "SELECT student_name,course_name,mobile FROM edu_trxorder WHERE course_id=898 AND trx_status='SUCCESS'";
$t_res = $conn->query($t_sql);
//总记录数
$total = $t_res->num_rows;
//总页数
$totalpage = ceil($total / $num);
//$sql = "SELECT student_name,course_name,mobile FROM edu_trxorder WHERE trx_status='SUCCESS' LIMIT $ofset,$num ";
$sql = "SELECT student_name,course_name,mobile FROM edu_trxorder WHERE course_id=898 AND trx_status='SUCCESS' LIMIT $ofset,$num ";
$result = $conn->query($sql);
$data = [];
while ($row = $result->fetch_assoc()) {
$data[] = $row;
}
$a = array("pages" => $total, "data" => $data);
echo json_encode($a);