Bootstrap智能消息提示框。

“我覺得操作成功后，需要一個彈出提示框”，客戶說。
“需要嗎？我覺得沒必要，錯誤的時候提示，成功時自動跳轉(zhuǎn)就行了！”，我弱弱的答。
“你那樣不人性化，聽我的，加一個”，客戶繼續(xù)說。
“那好吧！”我繼續(xù)弱弱的答。

第一關(guān)

其實(shí)客戶的要求，一點(diǎn)都難不倒我，看我的：

ajaxDoneSuccess("訂單已支付", "/mem/initDeal/2");

這串代碼就是把消息傳遞到前端。

function tabAjaxDone(json) {YUNM.debug("tab ajaxdone回調(diào)函數(shù)");YUNM.ajaxDone(json);if (json[YUNM.keys.statusCode] == YUNM.statusCode.ok || json[YUNM.keys.statusCode] == YUNM.statusCode.info) {var msg = json[YUNM.keys.message];// 彈出消息提示YUNM.debug(msg);var thenfunc = null;if ("forward" == json.callbackType) {thenfunc = function() {if (json.forwardURL) {location.href = json.forwardURL;}};}$.showInfo(msg, thenfunc);} }

1. 頁面回調(diào)函數(shù)執(zhí)行時，獲取服務(wù)端傳遞的消息，同時將后續(xù)操作加入到thenfunc中。
2. 緊接著，通過showInfo函數(shù)將消息輸出。
3. 你想看到showInfo方法，沒問題。

$.showInfo = function(str, func) {$.weeboxs.open(str, {boxid : 'yunm_info_box',contentType : 'text',showButton : true,showCancel : false,showOk : true,title : '提示 ',type : 'wee',onclose : func}); };

打開一個weebox彈出框，然后彈出框關(guān)閉的時候執(zhí)行后續(xù)函數(shù)func。

然后你點(diǎn)擊確定或者X號就會執(zhí)行回調(diào)函數(shù)跳轉(zhuǎn)。

第二關(guān)

“你這不夠人性化，不是所有的執(zhí)行成功都想彈出消息?！笨蛻粽f。
“好，明白”，我答。

這依然很簡單：

ajaxDoneSuccess("", "/mem/initDeal/2"); if (msg) { $.showInfo(msg, thenfunc, YUNM._set.timeout); } else {thenfunc(); }

第三關(guān)

“你這還不夠人性化，我不想點(diǎn)擊確定、關(guān)閉，就能夠跳轉(zhuǎn)?！笨蛻粽f。
“好，你想它多長時間自動關(guān)閉，才能讓你’dont make me wait’”，我喃喃道。
“什么？”，客戶把頭朝向我，若有所思的問。
“哦，沒啥，一會就好”，我懶得給他啰嗦。

這也沒啥，不就是加一個timeout嘛，weebox本身就有這個參數(shù)。

if (msg) {$.showInfo(msg, thenfunc, YUNM._set.timeout); } else {thenfunc(); } $.showInfo = function(str, func, timeout) {$.weeboxs.open(str, {boxid : 'yunm_info_box',contentType : 'text',showButton : true,showCancel : false,showOk : true,title : '提示 ' + timeout + "秒后自動關(guān)閉",type : 'wee',onclose : func,timeout : timeout}); };

笑對現(xiàn)實(shí)的無奈，不能后退的時候，不再傍徨的時候，永遠(yuǎn)向前　路一直都在──陳奕迅《路一直都在》
本文出自:【沉默王二的博客】

總結(jié)

以上是生活随笔為你收集整理的Bootstrap智能消息提示框的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。