Apicloud学习第四天
apicloud存储机制,添加和获取存储的数据
$api.setStorage('currentCity', cityList[i_]);
$api.getStorage('currentCity');
监听事件,name为监听的事件名称
api.addEventListener({
name: 'cityChange'
}, function(ret, err){
if( ret ){
// alert( JSON.stringify( ret ) );
var city=$api.byId('city');
city.innerHTML=ret.value.currentCity.name;
openFrames();
}else{
alert( JSON.stringify( err ) );
}
});
doT模板(js下载)
{{~it:value:index}} …… {{~}} //里面的为模板内容
{{=value.thumbnail.url}} //在模板中动态添加数据
{{?0==value.showType}}……{{??}}……{{?}}//判断写法
<script type="text/template" id="template">
{{~it:value:index}}
{{?0==value.showType}}
<div class="ware ware-0" >
<div class="content" onclick="fnOpenWareWin('{{=value.id}}')">
<img onload="fnLoadImage(this)" data-url="{{=value.thumbnail.url}}" class="thumbnail" src="../image/default_rect.png">
<div class="info">
<div class="name">{{=value.name}}</div>
<div class="description">{{=value.description}}</div>
<div class="price-tag">
<span class="price">¥{{=value.price}}</span>
<span class="unit">/{{=value.unit}}</span>
</div>
<div class="origin-price">超市:
<del>{{=value.originPrice}}元</del>
</div>
</div>
<div class="control">
<div class="panel">
<img class="minus" src="../image/minus.png">
<div class="count">0</div>
</div>
<img class="add" src="../image/add.png ">
</div>
</div>
</div>
{{??}}
<div class="ware ware-1">
<div class="content" onclick="fnOpenWareWin('{{=value.id}}')">
<img onload="fnLoadImage(this)" data-url="{{=value.thumbnail.url}}" class="thumbnail" src="../image/default_square.png">
<div class="info">
<div class="name">{{=value.name}}</div>
<div class="description">{{=value.description}}</div>
<div class="price-tag">
<span class="price">¥{{=value.price}}</span>
<span class="unit">/{{=value.unit}}</span>
</div>
<div class="origin-price">超市:
<del>{{=value.originPrice}}元</del>
</div>
</div>
<div class="control">
<div class="panel">
<img class="minus" src="../image/minus.png">
<div class="count">0</div>
</div>
<img class="add" src="../image/add.png ">
</div>
</div>
</div>
{{?}}
{{~}}
</script>
模板使用方法
function fnUpdateWareList(data_,loadMore_){//使用js模板
var list=$api.byId('list');
var tempFn=doT.template($api.byId('template').innerHTML);
var resultText=tempFn(data_);
if(loadMore_){
$api.append(list, resultText);
}else{
$api.html(list, resultText);
}
api.parseTapmode();//优化点击事件,主要是因为通过js加载进去的tepmode没有起到作用,所以要使用此方法进行优化
if(loadMore_){
if(data_.length<LIMIT){
var pushStatus=$api.byId('pushStatus');
pushStatus.innerHTML="没有啦";
}
}
}
图片缓存机制
api.imageCache({//图片缓存
url: dataUrl
}, function(ret, err){
if( ret ){
// alert( JSON.stringify( ret ) );
ele_.src=ret.url;
$api.attr(ele_, 'data-url',"");
}else{
alert( JSON.stringify( err ) );
}
});
页面刷新功能实现
api.setRefreshHeaderInfo({//刷新
visible: true,
loadingImg: 'widget://image/refresh.png',
bgColor: '#ccc',
textColor: '#fff',
textDown: '下拉刷新...',
textUp: '松开刷新...',
showTime: true
}, function(ret, err){
fnGetWare();
});
结束刷新
api.refreshHeaderLoadDone();//结束刷新
加载弹出对话框
api.showProgress({//加载弹出框
style: 'default',
animationType: 'fade',
title: '努力加载中...',
text: '先喝杯茶...',
modal: false
});
结束加载
api.hideProgress();//结束加载
将json文件转为字符串
$api.jsonToStr(params);
将字符串转换为json文件
$api.strToJson(params);
设置属性
$api.attr(ele_, 'data-url','value');
参数设置
var params={
fields:{},
where: { //设置条件
supportAreaId: currentCity.id,
wareTypeId:wareTypeList[api.pageParam.wareTypeIndex].id
},
skip:skip,//设置起步数
limit:LIMIT//设置步数
}
Apicloud学习第四天的更多相关文章
- 从零开始学习jQuery (四) 使用jQuery操作元素的属性与样式
本系列文章导航 从零开始学习jQuery (四) 使用jQuery操作元素的属性与样式 一.摘要 本篇文章讲解如何使用jQuery获取和操作元素的属性和CSS样式. 其中DOM属性和元素属性的区分值得 ...
- 前端学习 第四弹: HTML(一)
前端学习 第四弹: HTML(一) 元素分类:块元素 内联元素 块级元素在浏览器显示时,通常会以新行来开始(和结束). 例子:<h1>, <p>, <ul>, &l ...
- C#可扩展编程之MEF学习笔记(四):见证奇迹的时刻
前面三篇讲了MEF的基础和基本到导入导出方法,下面就是见证MEF真正魅力所在的时刻.如果没有看过前面的文章,请到我的博客首页查看. 前面我们都是在一个项目中写了一个类来测试的,但实际开发中,我们往往要 ...
- Android Animation学习(四) ApiDemos解析:多属性动画
Android Animation学习(四) ApiDemos解析:多属性动画 如果想同时改变多个属性,根据前面所学的,比较显而易见的一种思路是构造多个对象Animator , ( Animator可 ...
- 五、Android学习第四天补充——Android的常用控件(转)
(转自:http://wenku.baidu.com/view/af39b3164431b90d6c85c72f.html) 五.Android学习第四天补充——Android的常用控件 熟悉常用的A ...
- 四、Android学习第四天——JAVA基础回顾(转)
(转自:http://wenku.baidu.com/view/af39b3164431b90d6c85c72f.html) 四.Android学习第四天——JAVA基础回顾 这才学习Android的 ...
- MVC学习(四)几种分页的实现(3)
在这篇MVC学习(四)几种分页的实现(2)博文中,根据URL中传入的两个参数(页码数,首页.上一页.下一页.末页的标记符)来获得对应的分页数据, 只是传入的参数太多,调用起来不太方便(标记符不能够写错 ...
- MyBatis学习 之 四、MyBatis配置文件
目录(?)[-] 四MyBatis主配置文件 properties属性 settings设置 typeAliases类型别名 typeHandlers类型句柄 ObjectFactory对象工厂 pl ...
- 【转】MyBatis学习总结(四)——解决字段名与实体类属性名不相同的冲突
[转]MyBatis学习总结(四)——解决字段名与实体类属性名不相同的冲突 在平时的开发中,我们表中的字段名和表对应实体类的属性名称不一定都是完全相同的,下面来演示一下这种情况下的如何解决字段名与实体 ...
随机推荐
- js 判断元素(例如div)里的数据显示不全(数据长度大于元素长度)
//判断div里元素是否超出长度,true 超出,false 没有 dom=document.getElementById('id');function isEllipsis(dom) { va ...
- FIFO深度计算
本文设计思想采用明德扬至简设计法.在使用FPGA设计系统时,常需要利用FIFO进行数据缓存保证数据不丢失,因此计算FIFO深度是至关重要的.FIFO的深度主要取决于“最恶劣”的情况,以下对于两种最常见 ...
- pytest生成测试报告-4种方法
1.生成resultlog文件 2.生成JunitXML文件 3.生成html测试报告 > pip install pytest-html # 通过pip安装pytest-html 4. ...
- 二。Hibernate 查询 HQL、SQL方式
hibernate的查询1.HQL方式:所有查询都是根据java对象名来完成,对象名替换表名2.SQL方式:保留原来的sql查询风格3.可以通过设置第一条和最大条数来实现各种数据库的分页查询4.通过B ...
- Winform开发的应用环境和相关技术介绍
随着时间的推移,Winform也算是能够坚持下来最久的技术之一了,它的昔日辉煌和现今的依旧活跃,导致了它依旧拥有者很庞大的用户群体,虽然目前很多技术日新月异的,曾经的ASP.ASP.NET WebFo ...
- Facebook 广告投放相关概念简介(1)
本文不涉及具体代码实现,仅对开发API的前置内容做简单介绍,想参考代码请绕行! 广告主(广告管理工具) ·需要推广自己的应用.网站.主页,所以有了广告管理工具 . ·一个广告主仅可拥有一个广告账户(可 ...
- DAO层设计Junit测试
DAO层的设计: 在实际的开发中有一种项目的程序组织架构方案叫做MVC模式. MVC模式就是按照程序的功能将它们分成三层,分别是Modle层 (模型层).View(显示层).Controller(控制 ...
- 【刷题】【LeetCode】007-整数反转-easy
[刷题][LeetCode]总 用动画的形式呈现解LeetCode题目的思路 参考链接-空 007-整数反转 方法: 弹出和推入数字 & 溢出前进行检查 思路: 我们可以一次构建反转整数的一位 ...
- MySQL之日期时间类型
mysql(5.5)所支持的日期时间类型有:DATETIME. TIMESTAMP.DATE.TIME.YEAR. 几种类型比较如下: 日期时间类型 占用空间 日期格式 最小值 最大值 零值表示 D ...
- Linux下Nginx配置阿里云 SSL证书实现HTTPS访问
这篇文章主要介绍了nginx配置ssl证书实现https访问的示例 1.服务器系统:Centos 2. 阿里云申请SSL证书 选择“免费版DV SSL”,点击立即购买: 下载证书 列表中找到已签发的证 ...