Bootstrap+jfinal退出系統(tǒng)彈出確認(rèn)框的實(shí)現(xiàn)方法
本文為大家分享了jfinal與bootstrap的登出操作，旨在介紹如何通過a標(biāo)簽彈出登出確認(rèn)框，然后發(fā)送退出請(qǐng)求到j(luò)final，然后再刷新頁(yè)面的做法。主要難點(diǎn)在于有以下兩點(diǎn)：
1.如果通過a標(biāo)簽的內(nèi)容彈出登出確認(rèn)框；
2.如何通過a標(biāo)簽刷新對(duì)應(yīng)彈出的頁(yè)面。
一、前端技術(shù)
1.構(gòu)建a標(biāo)簽
注意：
1. target=”ajaxTodo”，指定a標(biāo)簽要通過ajax發(fā)起請(qǐng)求。
2. callback=”ajaxDone”，指定a標(biāo)簽回調(diào)函數(shù)
3. atitle=”你確定要退出嗎？”，指定確認(rèn)信息
2.初始化a標(biāo)簽ajax事件
function initUI(_box) {
var $p = $(_box || document);
// dwz.ajax.js
if ($.fn.ajaxTodo) {
$("a[target=ajaxTodo]", $p).ajaxTodo();
}
}
注意：
1. 頁(yè)面加載完成后執(zhí)行initUI方法，使target為ajaxTodo的a標(biāo)簽具有指定的ajaxTodo方法。
3.a標(biāo)簽的ajax請(qǐng)求
function ajaxTodo(url, callback) {
var $callback = callback;
if (!$.isFunction($callback)) {
$callback = eval('(' + callback + ')');
}
var forwardUrl = window.location.href;
if (url.indexOf("?") != -1) {
url += "&forwardUrl=" + forwardUrl;
} else {
url += "?forwardUrl=" + forwardUrl;
}
$.ajax({
type : 'POST',
url : url,
dataType : "json",
cache : false,
success : $callback,
error : YUNM.ajaxError
});
}
注意：
1. forwardUrl 記錄登出的頁(yè)面
4.為jquery對(duì)象增加ajaxTodo方法
$.fn.extend({
ajaxTodo : function() {
return this.each(function() {
var $this = $(this);
$this.click(function(event) {
var url = unescape($this.attr("href")).replaceTmById($(event.target).parents(".unitBox:first"));
YUNM.debug(url);
if (!url.isFinishedTm()) {
$.showErr($this.attr("warn"));
return false;
}
var title = $this.attr("atitle");
if (title) {
$.showConfirm(title, function() {
ajaxTodo(url, $this.attr("callback"));
});
} else {
ajaxTodo(url, $this.attr("callback"));
}
event.preventDefault();
});
});
},
});
5.回調(diào)函數(shù)
function ajaxDone(json) {
YUNM.ajaxDone(json);
if (json[YUNM.keys.statusCode] == YUNM.statusCode.ok || json[YUNM.keys.statusCode] == YUNM.statusCode.info) {
// 如果指定了后調(diào)轉(zhuǎn)頁(yè)面，進(jìn)行調(diào)轉(zhuǎn)
if (json.forwardUrl) {
location.href = json.forwardUrl;
}
}
}
6.彈出weebox確認(rèn)框
$.showConfirm = function(str, funcok, funcclose) {
var okfunc = function() {
$.weeboxs.close("yunm_confirm_box");
funcok.call();
};
$.weeboxs.open(str, {
boxid : 'yunm_confirm_box',
contentType : 'text',
showButton : true,
showCancel : true,
showOk : true,
title : '確認(rèn)',
width : 280,
type : 'wee',
onopen : function() {
init_ui_button();
},
onclose : funcclose,
onok : okfunc
});
};
function init_ui_button() {
$("button.ui-button[init!='init']").each(function(i, o) {
$(o).attr("init", "init"); // 為了防止重復(fù)初始化
$(o).ui_button();
});
}
二、jfinal技術(shù)
public void logout() {
if (getSession().getAttribute("username") != null) {
// 清除session
getSession().removeAttribute("username");
}
ajaxDoneSuccess("登出成功！");
renderJson();
}
增加logout方法。
效果：
如果大家還想深入學(xué)習(xí)，可以點(diǎn)擊這里進(jìn)行學(xué)習(xí)，再為大家附3個(gè)精彩的專題：
以上就是本文的全部?jī)?nèi)容，希望大家動(dòng)手實(shí)現(xiàn)Bootstrap+jfinal退出系統(tǒng)彈出確認(rèn)框，希望大家喜歡這篇文章，謝謝大家的閱讀。
- JFinal使用ajaxfileupload實(shí)現(xiàn)圖片上傳及預(yù)覽
- JFinal實(shí)現(xiàn)偽靜態(tài)的方法
- JFinal極速開發(fā)框架使用筆記分享
- jfinal與bootstrap的登出實(shí)戰(zhàn)詳解
- java 中JFinal getModel方法和數(shù)據(jù)庫(kù)使用出現(xiàn)問題解決辦法
- Bootstrap+jfinal實(shí)現(xiàn)省市級(jí)聯(lián)下拉菜單
- jfinal與bootstrap的登錄跳轉(zhuǎn)實(shí)戰(zhàn)演習(xí)
- jfinal添加jcaptcha驗(yàn)證碼實(shí)現(xiàn)方法
- Java中JFinal框架動(dòng)態(tài)切換數(shù)據(jù)庫(kù)的方法
相關(guān)文章
在IE和VB中支持png圖片透明效果的實(shí)現(xiàn)方法(vb源碼打包)
在IE和VB中支持png圖片透明效果的實(shí)現(xiàn)方法(vb源碼打包)，需要的朋友可以參考下。2011-04-04
JavaScript操作選擇對(duì)象的簡(jiǎn)單實(shí)例
下面小編就為大家?guī)硪黄狫avaScript操作選擇對(duì)象的簡(jiǎn)單實(shí)例。小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考，一起跟隨小編過來看看吧2016-05-05
最近有朋友問我node環(huán)境和瀏覽器的區(qū)別這一問題，今天小編就抽空給大家介紹下Node環(huán)境和瀏覽器的區(qū)別，感興趣的朋友一起看看吧2018-08-08
基于Three.js實(shí)現(xiàn)酷炫3D地圖效果
這篇文章主要為大家詳細(xì)介紹了如何利用Three.js實(shí)現(xiàn)酷炫3D地圖的效果，文中的示例代碼講解詳細(xì)，具有一定的借鑒價(jià)值，感興趣的小伙伴可以嘗試一下2022-10-10
這篇文章主要為大家詳細(xì)介紹了微信小程序?qū)崿F(xiàn)多張圖片上傳功能，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2020-11-11
Bootstrap 中的導(dǎo)航組件都依賴同一個(gè) .nav 類和ul，狀態(tài)類也是共用的。改變修飾類可以改變樣式。接下來通過本文給大家介紹bootstrap 導(dǎo)航組件使用方法，一起看看吧2017-01-01
這篇文章主要為大家詳細(xì)介紹了原生JS實(shí)現(xiàn)淡出淡入輪播圖，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2019-10-10
jq.ajax+php+mysql實(shí)現(xiàn)關(guān)鍵字模糊查詢(示例講解)
下面小編就為大家分享一篇jq.ajax+php+mysql實(shí)現(xiàn)關(guān)鍵字模糊查詢(示例講解)，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過來看看吧2018-01-01
在IE模態(tài)窗口中自由查看HTML源碼的方法...2007-03-03
這篇文章主要為大家詳細(xì)介紹了原生js實(shí)現(xiàn)3D輪播圖，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2019-09-09