ApiCloud_apicloud大神博客-CSDN博客

本文链接：https://blog.csdn.net/weixin_41722928/article/details/81066733

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
<link rel="stylesheet" type="text/css" href="../css/api.css"/>
<link rel="stylesheet" type="text/css" href="../css/common.css"/>
<script type="text/javascript" src="../script/zepto.min.js"></script>
<script type="text/javascript" src="../script/swipe.js"></script>
<style>
body {
min-width: 320px;
}

.category {
width: 100%;
margin-top: 20px;
}

.category li {
display: inline-block;
width: 24%;
text-align: center;
padding: 30px 0 10px;
background-size: 40px;
background-repeat: no-repeat;
background-position: top;
}

.category li span {
margin: 15px 10px 0 10px;
}
.img img{
width:2;
height:2;
padding-top:100px;
}

</style>
</head>

<body>
<ul class="category">
<li class="group" οnclick="openGroup('跟团游')" tapmode=""><span>
数据库
</span></li>

</ul>
<div id="show">
11111111
</div>
<script type="text/javascript" src="../script/api.js"></script>
<script>
apiready = function () {
var UIScrollPicture = api.require('UIScrollPicture');
UIScrollPicture.open({
rect: {
x: 0,
y: 0,
w:api.winWidth,
h:157,
},
data: {
paths: [
'widget://image/img/01.jpg',
'widget://image/img/02.jpg',
'widget://image/img/03.jpg',
'widget://image/img/04.jpg',
'widget://image/img/05.jpg',
'widget://image/img/06.jpg',
'widget://image/img/07.jpg',
]
},
styles: {
indicator: {
align: 'center',
color: '#9B9B9B',
activeColor: '#000000'
}
},
placeholderImg: 'widget://res/slide1.jpg',
contentMode: 'scaleToFill',
interval: 3,
fixedOn:'frm_main1',
loop: true,
fixed: true
}, function(ret, err) {
if (ret) {
// alert(JSON.stringify(ret));
} else {
// alert(JSON.stringify(err));
}
}); //下拉刷新
api.setRefreshHeaderInfo({
visible: true,
bgColor: '#ccc',
textColor: '#fff',
textDown: '下拉刷新...',
textUp: '松开刷新...',
showTime: true
}, function (ret, err) {
api.refreshHeaderLoadDone();
});
//数据读取
var model = api.require('model');
var query=api.require('query');
model.config({
appId:'A6086914697118',
appKey: '88DC126D-962C-497C-3579-0763D565AF7E',
host: 'https://d.apicloud.com'
});

query.createQuery({
}, function(ret, err) {
if (ret && ret.qid) {
model.findAll({
class : 'news',
qid : ret.qid
}, function(ret, err) {
//var UIListGroup = api.require('UIListGroup');
var abcd= document.getElementById('show');//$api.byId('show');
for (var i = 0; i < ret.length; i++) {
$api.append(abcd,
"<div class='img'><img src='../image/img/jiantou.png'><a href='#' οnclick=onDetail('"+ret[i].id+"')>"+ret[i].title+"-----"+ret[i].simplesum+"</a></img></div>");
}
});
}
});
var UIListGroup = api.require('UIListGroup');
UIListGroup.open({
rect: {
x: 0,
y: 0,
w: api.winWidth,
h: api.frameHeight
},
data: [{
uid: '1001',
imgPath: 'widget://image/img/jiantou.png',
title: '标题',
subTitle: '子标题，说明文字',
time: '今天 13:45',
}, {
uid: '1001',
imgPath: 'widget://image/img/jiantou.png',
title: '标题',
subTitle: '子标题，说明文字',
time: '今天 13:45',
}],
rightBtns: [{
bgColor: '#388e8e',
activeBgColor: '',
width: 70,
title: '按钮',
titleSize: 12,
titleColor: '#fff'
}],
styles: {
borderColor: '#696969',
item: {
bgColor: '#AFEEEE',
activeBgColor: '#F5F5F5',
height: 55,
imgMarginLeft:10,
imgMarginRight:10,
imgWidth: 20,
imgHeight: 20,
imgCorner: 4,
placeholderImg: '',
titleMarginTop:5,
subTitleMarginBottom:5,
titleSize: 12,
titleColor: '#000',
subTitleSize: 12,
subTitleColor: '#000',
subTitleWidth: 100,
rightImgSize:30,
timeColor: '#000',
timeSize: 16,
marginRight: 10,
}
},
fixedOn: api.frameName
}, function(ret, err) {
if (ret) {
alert(JSON.stringify(ret));
} else {
alert(JSON.stringify(err));
}
});
}
function onDetail(id){
alert(id);
api.openWin({
name: 'content',
url: 'html/content.html',
pageParam: {"id": id}
})
}
function openGroup(param) {
api.openWin({
name: 'win_group',
url: 'win_group.html',
pageParam: {"name": param}
})
}
function openSlider(param) {
api.openWin({
name: 'win_sliderDetail',
url: 'win_sliderDetail.html',
pageParam: {"name": param}
})
}
function openAround() {
api.openWin({
name: 'win_around',
url: 'win_around.html'
})
}
function toDetail() {
api.openWin({
name: "win_toursDetail",
url: 'win_toursDetail.html'
})
}
</script>
</body>
</html>