dcloud会员激活mui
为什么80%的码农都做不了架构师?>>>
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
<link href="../../css/mui.min.css" rel="stylesheet" />
<style>
#head {line-height: 40px;}
#head-img1 { position: absolute; bottom: 10px; right: 16px; width: 40px; height: 40px;}
.mui-table-view span.mui-pull-right {color:#969696;}
</style>
</head>
<body>
<header class="mui-bar mui-bar-nav">
<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
<h1 class="mui-title mui-text-left">会员</h1>
</header>
<div class="mui-content">
<div class="mui-scroll-wrapper">
<div class="mui-scroll" style="padding-top:55px;">
<!--这里放置真实显示的DOM内容-->
<ul class="mui-table-view">
<li class="mui-table-view-cell">
<a id="head" class="">头像
<span class="mui-pull-right">
<img class="head-img mui-action-preview" id="head-img1" src="../../images/shuijiao.jpg"/>
</span>
</a>
</li>
<li class="mui-table-view-cell">
<a>姓名<span class="mui-pull-right" id="userName">检爱一生</span></a>
</li>
<li class="mui-table-view-cell">
<a>身份证号<span class="mui-pull-right" id="idCard">888888888888888888</span></a>
</li>
<li class="mui-table-view-cell">
<a>会员状态<span class="mui-pull-right" id="vipStatus">已激活</span></a>
</li>
<li class="mui-table-view-cell">
<a>有效期至<span class="mui-pull-right" id="term">2088.08.08</span></a>
</li>
<li class="mui-table-view-cell">
<div class="mui-input-row">
<label>激活码</label>
<input type="number" class="mui-input-clear mui-text-right" id="activateCode" placeholder="请输入激活码">
</div>
</li>
</ul>
</div>
<button id="activate" class="mui-btn mui-btn-block" style="position:absolute;left:0;bottom:0;">激活</button>
</div>
</div>
</body>
<script src="../../js/mui.min.js"></script>
<script type="text/javascript">
mui.plusReady(function(){
var userName = document.getElementById("userName");
var idCard = document.getElementById("idCard");
var vipStatus = document.getElementById("vipStatus");
var term = document.getElementById("term");
var activate = document.getElementById("activate");
var activateCode = document.getElementById("activateCode");
mui.ajax('http://',{
data:{
access_token:'WyJOdz09IiwiTVRRNE16WTRNakEwT1E9PSIsIk1USTVOakF3TUE9PSJd'
},
dataType:'json',//服务器返回json格式数据
type:'post',//HTTP请求类型
timeout:10000,//超时时间设置为10秒;
//headers:{'Content-Type':'application/json'},
success:function(data){
//console.log(JSON.stringify(data))
if(data.code == 1){
userName.innerHTML = data.data.real_name;
idCard.innerHTML = data.data.id_card;
if(data.data.vip_status == 0){
vipStatus.innerHTML = '未激活';
activate.style.display = 'block';
term.parentNode.parentNode.style.display = 'none';
activateCode.parentNode.parentNode.style.display = 'block';
}else if(data.data.vip_status == 1){
vipStatus.innerHTML = '已激活';
activate.style.display = 'none';
term.parentNode.parentNode.style.display = 'block';
activateCode.parentNode.parentNode.style.display ='none';
var timestamp = data.data.user_time_length;
var d = new Date(timestamp * 1000);
term.innerHTML = (d.getFullYear())+"."+(d.getMonth() + 1)+"."+(d.getDate());
}
}else{
mui.toast(data.msg);
}
},
error:function(xhr,type,errorThrown){
mui.toast('系统异常');
}
});
});
mui("body").on('tap','#activate',function(){
var vipStatus = document.getElementById("vipStatus");
var term = document.getElementById("term");
var activate = document.getElementById("activate");
var activateCode = document.getElementById("activateCode");
var val = activateCode.value;
mui.ajax('http://',{
data:{
access_token:'WyJOdz09IiwiTVRRNE5ESXhPRGMyTVE9PSIsIk1USTVOakF3TUE9PSJd',
activation_code:val
},
dataType:'json',//服务器返回json格式数据
type:'post',//HTTP请求类型
timeout:10000,//超时时间设置为10秒;
//headers:{'Content-Type':'application/json'},
success:function(data){
//console.log(JSON.stringify(data))
if(data.code == 1){
vipStatus.innerHTML = '已激活';
activateCode.parentNode.parentNode.style.display = 'none';
activate.style.display = 'none';
term.parentNode.parentNode.style.display = 'block';
var timestamp = data.data.user_time_length;
var d = new Date(timestamp * 1000);
term.innerHTML = (d.getFullYear())+"."+(d.getMonth() + 1)+"."+(d.getDate());
mui.toast('激活成功');
}else if(data.code == -1){
mui.toast(data.msg);
}
},
error:function(xhr,type,errorThrown){
mui.toast('系统异常');
}
});
});
</script>
</html>
转载于:https://my.oschina.net/af666/blog/825147
dcloud会员激活mui相关推荐
- Dcloud mui初级入门资源
文章来源:小青年原创 发布时间:2016-05-15 关键词:mui,html5+ 转载需标注本文原始地址:http://zhaomenghuan.github.io... 写在前面 相信很多朋友初次 ...
- 推荐手机H5应用快速开发 UI库(Framework7、SUI(淘宝)、MUI、WeUI(微信)、GMU(百度)、Frozen UI(QQ))
推荐手机H5应用快速开发 UI库 Framework7(阿里巴巴).SUI(淘宝).MUI( dcloud-HBuilder).WeUI(微信).Frozen UI(腾讯手机QQ).GMU(百度).A ...
- MUI框架之输入框Input
input输入框的官方api文档:http://dev.dcloud.net.cn/mui/ui/#input 一.输入框类型 输入框的类型是根据type来决定是普通输入框还是密码框,搜索框等类型 & ...
- 使用MUI框架,模拟手机端的下拉刷新,上拉加载操作。
套用mui官方文档的一句话:"开发者只需关心业务逻辑,实现加载更多数据即可".真的是不错的框架. 想更多的了解这个框架:http://dev.dcloud.net.cn/mui/ ...
- 连接真机开发安卓(Android)移动app MUI框架——混合式开发(二) 带你项目开发(最新版)
今天是很丧的一天,做什么都提不起兴趣,不知道何时才能做到道家的"无为,而无所不为",也无法理解范仲淹的"不以物喜不以己悲".可是再没兴趣,学习还是要继续!!!为 ...
- 项目怎么导入mui_Vue项目MUI的使用
MUI官网: https://dev.dcloud.net.cn/mui/ui/ 一.下载: 1.下载github内容至本地解压: github地址:https://github.com/dcloud ...
- mui ajax方法
mui ajax方法详解: mui提供了mui.ajax,在此基础上有分装出mui.get()/mui.getJSON()/mui.post()三个方法. mui.ajax( url [,settin ...
- MUI框架开发HTML5手机APP(一)--搭建第一个手机APP
前 言 JRedu 随着HTML5的不断发展,移动开发成为主流趋势!越来越多的公司开始选择使用HTML5开发手机APP,而随着手机硬件设备配置的不断提升,各种开发框架的不断优化,也使着H5开发的 ...
- MUI框架开发HTML5手机APP(一)--搭建第一个手机APP(转)
出处:http://www.cnblogs.com/jerehedu/p/7832808.html 前 言 JRedu 随着HTML5的不断发展,移动开发成为主流趋势!越来越多的公司开始选择使用H ...
最新文章
- 北斗导航 | ION GNSS+ 2021、 ION GNSS+ 2020会议论文下载:ION 美国导航学会
- python调用linux软键盘_在Linux中使用Python模拟键盘按键
- Python 语法细节(Python 2.x 与 Python 3.x 语法差异)
- [机器学习] 二分类模型评估指标---精确率Precision、召回率Recall、ROC|AUC
- python3(十)pickle库
- c++ map的存储结构_「软帝学院」java集合类框架map及相关常见问题二
- Android开发(3) | 权限和内容提供器的应用——调用相机和相册
- java 调用php文件上传_php上传文件,接口是java,go。
- 实力吊打国家黑客:从密码喷洒到完全控制网络只需几天
- 【python问题系列--4】ValueError: operands could not be broadcast together with shapes (100,3) (3,1)...
- 系统分析与设计方法---需求分析与软件设计
- 在服务器上搭建Cadence16.6 CIS共享库
- python蜂鸣器天空之城频率_蜂鸣器版天空之城 - osc_lopdl9qi的个人空间 - OSCHINA - 中文开源技术交流社区...
- excel导入时手机号码格式错误的一个解决方法
- 实训1 构建一个计算列表中位数的函数
- 树莓派离线语音唤醒snowboy
- linux中断数据结构图,北桥.PCI.linuxPCI中断处理
- 点云数据在Matlab生成格网数据-2021-10-18
- 台式计算机无法读取dvd,教你电脑读不了dvd光盘的修复教程
- 高压真空断路器特性实验
热门文章
- DotNet控件缩写
- 配置 IIS 7 显示详细错误信息
- python 图像宽度_正确的方法和Python包可以找到图像的宽度
- 软硬交互代码示例_HarmonyOS应用开发-元程序交互
- 自学前端开发:想要学习成为一名优秀的前端开发者,代码之外需要关注的问题
- ajax 2分钟超时_ajax和axios、fetch的区别
- 计算机网络令牌总线在哪一页,计算机网络应用基础综合练习
- rpm linux gcc安装目录,Linux环境下通过rpm安装gcc的顺序
- call需要多大带宽 video_KCP TCP是为流量设计的(每秒内可以传输多少KB的数据),讲究的是充分利用带宽。而KCP是为流速设计的(单个数据包从一端发送到一端需要多少时间)...
- php递归实现冒泡排序,排序算法之PHP版快速排序、冒泡排序