mui实现自动登录
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
<title></title>
<link href="css/mui.min.css" rel="stylesheet" />
<script src="js/pub.js" type="text/javascript" charset="utf-8"></script>
<style>
body {
height: 100%;
background: #fff;
}
.mui-content {
height: 100%;
padding: 0;
background: #fff;
}
img {
margin-top: 30px;
}
</style>
</head>
<body>
<header class="mui-bar mui-bar-nav">
<!--<h1 class="mui-title">欢迎光临</h1>-->
<a id='done' class="mui-btn mui-btn-link mui-pull-right mui-btn-blue mui-disabled" href="setting_iandtop.html">
<span class="mui-icon mui-icon-list"></span>
</a>
</header>
<div class="mui-content">
<center><img src="data:images/iandtop.png" /></center><br><br>
<form id='login-form' class="mui-input-group">
<div class="mui-input-row">
<label>账号</label>
<input id='account' type="text" value='' class="mui-input-clear mui-input" placeholder="工号/手机号/邮箱">
</div>
<div class="mui-input-row">
<label>密码</label>
<input id='password' type="password" value="" class="mui-input-clear mui-input" placeholder="请输入密码">
</div>
</form>
<form class="mui-input-group">
<ul class="mui-table-view mui-table-view-chevron">
<li class="mui-table-view-cell">
自动登录
<div id="autoLogin" class="mui-switch">
<div class="mui-switch-handle"></div>
</div>
</li>
</ul>
</form>
<div class="mui-content-padded">
<button id='btnLogin' class="mui-btn mui-btn-block mui-btn-primary" style="height:40px;padding:0 10px;">登 录</button>
<!--<br/>
<div class="link-area">
<a id='reg' href="register.html">注册账号</a> <span class="spliter">|</span>
<a id='forgetPassword'>忘记密码</a>
</div>-->
</div>
<!--<div class="mui-content-padded oauth-area">
<a href="setting_iandtop.html">设置服务器地址</a>
</div>-->
</div>
</body>
<script src="js/mui.min.js"></script>
<script src="js/pub.js"></script>
<script type="text/javascript" charset="utf-8">
(function(mui, doc) {
var suserName = document.getElementById('account');
var spassWord = document.getElementById('password');
var subLogin = document.getElementById('btnLogin');
var autoSwitch = document.getElementById("autoLogin");
var url = OCS.getUrl();
mui.init({
swipeBack: true //启用右滑关闭功能
});
// 所有方法都放到这里
mui.plusReady(function() {
subLogin.addEventListener('tap', function(event) {
postData(suserName.value, spassWord.value);
});
autoSwitch.addEventListener("toggle", function(event) {
window.localStorage.setItem(OCS.token.SWITCH_STATE, event.detail.isActive);
});
autoLogin();
});
function autoLogin() {
autoSwitch.value = window.localStorage.getItem(OCS.token.SWITCH_STATE);
suserName.value = window.localStorage.getItem(OCS.token.TOKEN_USER);
spassWord.value = window.localStorage.getItem(OCS.token.TOKEN_PW);
if(autoSwitch.value == 'true' || autoSwitch.value == true) {
mui("#autoLogin").switch().toggle();
postData(suserName.value, spassWord.value);
}
}
function postData(name, password) {
mui.post(url + 'Login', {
psncode: name,
password: password
}, function(data) {
window.localStorage.setItem(OCS.token.TOKEN_USER, suserName.value);
window.localStorage.setItem(OCS.token.TOKEN_PW, spassWord.value);
window.localStorage.setItem(OCS.token.TOKEN_TOKEN, data.resultData);
if(data.success + "" != "true") { //如果登陆失败,提示
mui.alert(data.msg);
} else {
mui.post(url + 'IPI', {
token: data.resultData
}, function(dataIPI) {
window.localStorage.setItem(OCS.person.id, dataIPI.resultData.id);
window.localStorage.setItem(OCS.person.addr, dataIPI.resultData.addr);
window.localStorage.setItem(OCS.person.birthdate, dataIPI.resultData.birthdate);
window.localStorage.setItem(OCS.person.email, dataIPI.resultData.email);
window.localStorage.setItem(OCS.person.sex, dataIPI.resultData.sex);
window.localStorage.setItem(OCS.person.usedname, dataIPI.resultData.usedname);
window.localStorage.setItem(OCS.person.mobile, dataIPI.resultData.mobile);
window.localStorage.setItem(OCS.person.psnname, dataIPI.resultData.psnname);
}, 'json');
mui.openWindow({
url: "index.html"
});
}
}, 'json');
}
})(mui, document);
</script>
<script type="text/javascript">
var first = null;
var showMenu = false;
mui.back = function() {
if(showMenu) {
closeMenu();
} else {
//首次按键,提示‘再按一次退出应用’
if(!first) {
first = new Date().getTime();
mui.toast('再按一次退出应用');
setTimeout(function() {
first = null;
}, 1000);
} else {
if(new Date().getTime() - first < 1000) {
plus.runtime.quit();
}
}
}
};
var slider = mui("#slider");
slider.slider({
interval: 3000
});
</script>
</html>
mui实现自动登录的更多相关文章
- springboot+layui实现PC端用户的增删改查 & 整合mui实现app端的自动登录和用户的上拉加载 & HBuilder打包app并在手机端下载安装
springboot整合web开发的各个组件在前面已经有详细的介绍,下面是用springboot整合layui实现了基本的增删改查. 同时在学习mui开发app,也就用mui实现了一个简单的自动登录和 ...
- HBuilder开发APP自动登录时跳过"登录页面"
刚接触开发公司APP项目,用HBuilder开发工具. manifest.json中的入口页面就是"登录页面",现在获取到自动登录状态是true,但是真机联调时"登录页面 ...
- Linux开机自动登录(文本模式)
• Linux系统启动登录过程 以RedHat/CentOS为例,Linux系统Level3模式下从启动到登录的整个过程大致如下: 1> 加载BIOS信息:包含了CPU/显卡/内存/硬盘/网卡等 ...
- expect实现自动登录
自动登录主机(ssh) 建脚本item2login.sh,包含如下内容 #!/usr/bin/expect set timeout 30 spawn ssh -p [lindex $argv 0] [ ...
- cookie自动登录的实现
cookie自动登录是指把用户登录的信息按期限(自定)保存在客户端,当用户请求登录时判断客户端用没有cookie对象,有的话填充值,否则登录界面的输入框为空,不进行填充. 登录界面 ...
- windows 2003自动登录的具体步骤
在win2003系统中,使用最多的可能就是远程操作了,关于远程操作的那些事很多用户还是有些迷茫的.如果win2003系统远程重启后,要重新登录系统十分的麻烦,如何才能实现重启后的自动登录呢?让高手告诉 ...
- 如何设置phpMyAdmin自动登录和取消自动登录
如何设置phpMyAdmin自动登录? 首先在根目录找到config.sample.inc.php复制一份文件名改为config.inc.php(如果已经存在 config.inc.php 文件,则直 ...
- 利用activeX控件在网页里自动登录WIN2003远程桌面并实时控制
首先要自己配置并打开受控端的WEB远程桌面服务,这个在“添加/删除windows组件”里有,我只在windows 2003 server里试过,没试过XP.下面我们在客户端安装微软提供的远程桌面客户端 ...
- 简单的行为控制管理方法,自动登录,session定时验证码过期
代码很简单 实现的方式很多,用cookies 用static 变量 file文件缓存 等等 比如 //简单行为管理,如果请求此方法次数多于5次,就显示验证码 吧当前方法的name传进来,有效时间是5分 ...
随机推荐
- 你好,C++(35)类是如何藏私房钱的?6.2.4 拷贝构造函数
6.2.6 类成员的访问控制 类成员包括类的成员变量和成员函数,它们分别用来描述类的属性和行为.而类成员的访问控制决定了哪些成员是公开的,可以被外界访问,也可以被自身访问:哪些成员是私有的,只能在类 ...
- linux进程创建
1. 进程是程序的执行,会被加载到内存中,每个进程包括程序的代码和数据,其中数据包括程序的变量的数据,外部数据,程序堆栈. 2. Linux中,输入命令,如vi main.c 通过shell来执行, ...
- Asp.net的IP地址屏蔽功能设计
"IP地址的长度为32位,分为4段,每段8位,用十进制数字表示,每段数字范围为0~255,段与段之间用句点隔开." 由此我们了解到,IP地址实际上是一个32位正整数,在C#中可以使 ...
- centos账户管理命令(root权限)
cat /etc/passwd | grep -v /sbin/nologin | cut -d : -f 1 查看所有用户 userdel -r 用户名 -删除用户 ...
- 78 Subsets(求子集Medium)
题目意思:求解一个数组的所有子集,子集内的元素增序排列eg:[1,3,2] result:[],[1],[2],[1,2],[3],[1,3],[2,3],[1,2,3]思路:这是一个递推的过程 [] ...
- 002.AngularJs调用Restful实现CRUD
本节我们主要给大家介绍AngularJs如何调用Restful,实现数据的CRUD. 主要用到的技术: 后端:ASP.NET WebApi + SQLServer2008 前端:AngularJs,B ...
- php 4.X与5.x版本构造函数区别与类的继承
今天看ecshop源码的时候发现 构造函数是和类名一样,以前没接触过,一下子疑惑啦 HP4.x 版本: PHP 4.x 的构造函数名与类名相同. 注意:在子类里父类的构造函数不会自动执行 ...
- C语言 位操作
c语言位操作中需要注意有: 位操作只针对整型和字符型数据 在右移操作中:对无符号数和有符号中的正数补 0:符号数中的负数,取决于所使用的系统:补 0 的称为“逻辑右移”,补 1 的称为“算术右移”. ...
- uva 10820 (筛法构造欧拉函数)
send a table When participating in programming contests, you sometimes face the following problem: Y ...
- 理解java中的ThreadLocal(转)
一.对ThreadLocal概述 JDK API 写道: 该类提供了线程局部 (thread-local) 变量.这些变量不同于它们的普通对应物,因为访问某个变量(通过其 get 或 set 方法)的 ...