點選載入更多先載入5條，然後依次分批載入
html頁面
<center>
<div id="more" data-status="1" onclick="app.hospital.dept.busy.loadMore();" style="margin: 20px;display:none;">
載入更多
</div>
</center>
js相關程式碼
app.hospital.dept.busy = {
orgCode:"",
dataSource:null,
count:5,
init : function() {
debugger;
app.hospital.dept.busy.findHosInfo();
app.hospital.dept.busy.queryDeptStaicData();
},
queryDeptStaicData :function(){
app.loading.show();
app.api.hospital.queryDeptStaicData({
data : {orgCode : app.hospital.dept.busy.orgCode},
success : function(result) {
if (result.responseCode == "0") {
app.alert(result.responseMsg, '錯誤');
} else {
debugger;
app.hospital.dept.busy.dataSource = result.datas;
if (app.hospital.dept.busy.dataSource.length<=5) {
j$("#more").hide();
}
for(var i=0; i<5; i++){
var id = "deptEchartsDiv_"+i;
var template = j$("#deptEchartsDivTemplate").clone();
var div = j$(template.html());
div.attr("id",id);
j$("#deptEchartsShowDiv").append(div);
var bd = app.hospital.dept.busy.dataSource[i].BUSY_DATE;
var onum = app.hospital.dept.busy.dataSource[i].O_NUM;
var dn = app.hospital.dept.busy.dataSource[i].DEPT_NAME;
app.hospital.dept.busy.createEcharts(id,dn,bd.split(","),onum.split(","));
}
j$("#more").show();
}
app.hospital.dept.busy.count=5;
app.loading.hide();
},
error : app.api.error
});
},
findHosInfo:function(){
app.api.hospital.queryHositoryInfo({
data : {orgCode : app.hospital.dept.busy.orgCode},
success : function(result) {
debugger;
if (result.responseCode == "0") {
app.alert(result.responseMsg, '錯誤');
} else {
var datasTemp = result.datas;
//alert(datasTemp);
var template = $('#tmpl-hospital-introduction-list').html();
$('#hospital-introduction-list').html($m.tmpl(template, datasTemp));
}
},
error : app.api.error
});
},
createEcharts : function(id,name,bd,onum){
var myChart = echarts.init(document.getElementById(id));
var option = {
title: {
text: name
},
tooltip: {},
legend: {
data:['科室']
},
xAxis: {
data: bd,
axisLabel:{
interval:0,
rotate:-30,
}
},
yAxis: {},
series: [{
name: '銷量',
type: 'bar',
data: onum
}]
};
myChart.setOption(option);
},
loadMore : function(){
var index=5;
if (app.hospital.dept.busy.count<app.hospital.dept.busy.dataSource.length) {
if(app.hospital.dept.busy.dataSource.length-app.hospital.dept.busy.count<5){
debugger;
index = app.hospital.dept.busy.dataSource.length-app.hospital.dept.busy.count;
}
for(var i=app.hospital.dept.busy.count; i<app.hospital.dept.busy.count+index; i++){
var id = "deptEchartsDiv_"+i;
var template = j$("#deptEchartsDivTemplate").clone();
var div = j$(template.html());
div.attr("id",id);
j$("#deptEchartsShowDiv").append(div);
var bd = app.hospital.dept.busy.dataSource[i].BUSY_DATE;
var onum = app.hospital.dept.busy.dataSource[i].O_NUM;
var dn = app.hospital.dept.busy.dataSource[i].DEPT_NAME;
app.hospital.dept.busy.createEcharts(id,dn,bd.split(","),onum.split(","));
}
app.hospital.dept.busy.count+=index;
if(app.hospital.dept.busy.count>=app.hospital.dept.busy.dataSource.length){
j$("#more").hide();
}
}
app.loading.hide();
},
open : function(orgCode){
debugger;
app.hospital.dept.busy.orgCode = orgCode;
if(typeof(navigator.connection) != "undefined" && typeof(Connection) != "undefined"){
if(navigator.connection.type == Connection.NONE) {
app.alert('網路連線不穩定，請檢查網路後重新整理重試。', '網路異常');
} else {
app.viewMain.router.load({url: 'pages/guide/deptBusy.html'});
}
}else{
app.viewMain.router.load({url: 'pages/guide/deptBusy.html'});
}
}
};