注销其实可以使用一个基本的a标签。
例如我把登录和注销放在了底部导航条navbar中。
基本代码:
~~~
<div id="navbar" >
<a href="#home" id='navbar_home' class='icon home' >首页</a>
<a href="#login" id='loginlink' class='icon home'>登陆</a>
<a id='logoutlink' class='icon home'>注销</a>
<a href="#about" id='navbar_picture' class='icon picture'>关于我们</a>
</div>
~~~
js代码:
~~~
function logoutFun() {
$.ui.popup({
title: "提示",
message: "确定注销吗",
cancelText: "取消",
cancelCallback: function () { },
doneText: "确定",
doneCallback: function () { logoutSureFun() },
cancelOnly: false
});
}
function logoutSureFun() {
var url = serviceUrl + "UIPhoneAjax/GetData.ashx?type=logout";
$.post(url, null, function (res) {
if (res.IsSuccess) {
$("#loginlink").show();
$("#logoutlink").hide();
} else {
$.ui.popup(res.Msg);
}
}, "json", function () { $.ui.hideMask(); $.ui.popup("网络连接失败!"); })
}
~~~
实现效果:
![](https://box.kancloud.cn/2016-02-23_56cbb4b8d9f7e.jpg)
需要注意的时,使用此弹出必须添加相关的插件af.popup.js
- 前言
- 使用jqMobi开发app基础
- jqMobi开发app页面注意事项
- 使用jqMobi开发app基础:定义header
- 使用jqMobi开发app基础:定义footer
- 使用jqMobi开发app基础:通过panel添加内容
- 使用jqMobi开发app基础:panel属性data-defer介绍
- 使用jqMobi开发app基础:Side Menu
- 使用jqMobi开发app基础:Styled Lists布局
- 使用jqMobi开发app基础:Grid布局
- 使用jqMobi开发app基础:响应式布局介绍
- 使用jqMobi开发app基础:Toggle Switches开关按钮
- 使用jqMobi开发app基础:HTML5 LocalStorage 本地存储
- 使用jqMobi开发app基础:登录页面的实现
- 使用jqMobi开发app基础:注销页面的实现
- 使用jqMobi开发app基础:viewport指令
- 使用jqMobi开发app基础:a标签的使用
- 使用jqMobi开发app基础:Scrolling的使用,向上向下拖动,动态添加数据
- 使用jqMobi开发app基础:页面传值方式
- 使用jqMobi开发app基础:panel之间的跳转方式
- 使用jqMobi开发app基础:panel之间的跳转方式总结
- 使用jqMobi开发app基础:下拉select
- 使用jqMobi开发app基础:真的只能存在一个DOM吗?
- 使用jqMobi开发app基础:使用 jQuery
- 使用jqMobi开发app基础:Scrolling的使用,拖动后大量空白的解决方法
- 使用jqMobi开发app基础:Scrolling的使用,停止和继续拖动有关的问题
- 使用jqMobi开发app基础:Badge的使用
- 使用jqMobi开发app基础:如何拨打电话?
- 使用jqMobi开发app基础:弹出内容的设计