Bootstrap智能消息提示框。

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

第一關

其實客戶的要求，一點都難不倒我，看我的：

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

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

function tabAjaxDone(json) {YUNM.debug("tab ajaxdone回調函數");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. 頁面回調函數執行時，獲取服務端傳遞的消息，同時將后續操作加入到thenfunc中。
2. 緊接著，通過showInfo函數將消息輸出。
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彈出框，然后彈出框關閉的時候執行后續函數func。

然后你點擊確定或者X號就會執行回調函數跳轉。

第二關

“你這不夠人性化，不是所有的執行成功都想彈出消息。”客戶說。
“好，明白”，我答。

這依然很簡單：

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

第三關

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

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

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 + "秒后自動關閉",type : 'wee',onclose : func,timeout : timeout}); };

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

總結

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

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。