快捷導(dǎo)航

jquery封裝的對(duì)話框簡單實(shí)現(xiàn)

更新時(shí)間：2013年07月21日 17:46:57 作者：

本文為大家詳細(xì)介紹下使用jquery簡單實(shí)現(xiàn)封裝的對(duì)話框，具體實(shí)現(xiàn)代碼如下，感興趣的朋友可以參考下哈，希望對(duì)大家有所幫助

 
var _alert_iconCss = "tipmsg_icoInfo"; 
var _confirm_iconCss = "tipmsg_icoConfirm"; 
var _error_iconCss = "tipmsg_icoError"; 
var _warning_iconCss = "tipmsg_icoWarning"; 
function dialogInit(type, msg) { 
var iconCss = ""; 
switch (type) { 
case "confirm" : iconCss = _confirm_iconCss; break; 
case "error" : iconCss = _error_iconCss; break; 
case "warning" : iconCss = _warning_iconCss; break; 
default : iconCss = _alert_iconCss; break; 
} 

var htmlStr = "<div id='" + type + "Div' style='display: none;'><p><span class='" + iconCss + "' style='float:left; margin:0 7px 50px 0;width:35px;height:35px;'></span>" + msg + "</p></div>"; 
return htmlStr; 
} 
function Alert(msg, okCallback) { 
var title = "提示"; 
var type = "alert"; 
var html = dialogInit(type, msg); 
var div = $("body").find("#"+type+"Div"); 
div.remove(); 
$('body').append($(html)); 

var buttons = {"確定" : function () { 
if(okCallback) okCallback(); 
$(this).dialog("close"); 
} 
}; 

$("#"+type+"Div").dialog({ 
modal : true, 
title : title, 
buttons : buttons 
}); 
} 
function Confirm(msg, okCallback, cancelCallback) { 
var title = "確認(rèn)"; 
var type = "confirm"; 
var html = dialogInit(type, msg); 
var div = $("body").find("#"+type+"Div"); 
div.remove(); 
$('body').append($(html)); 

var buttons = {"確定" : function () { 
if(okCallback) okCallback(); 
$(this).dialog("close"); 
}, 
"取消" : function () { 
if(cancelCallback) cancelCallback(); 
$(this).dialog("close"); 
} 
}; 
$("#"+type+"Div").dialog({ 
modal : true, 
title : title, 
buttons : buttons 
}); 
} 
function Error(msg, okCallback) { 
var title = "錯(cuò)誤"; 
var type = "error"; 
var html = dialogInit(type, msg); 
var div = $("body").find("#"+type+"Div"); 
div.remove(); 
$('body').append($(html)); 

var buttons = {"確定" : function () { 
if(okCallback) okCallback(); 
$(this).dialog("close"); 
} 
}; 

$("#"+type+"Div").dialog({ 
modal : true, 
title : title, 
buttons : buttons 
}); 
} 
function Warning(msg, okCallback) { 
var title = "警告"; 
var type = "warning"; 
var html = dialogInit(type, msg); 
var div = $("body").find("#"+type+"Div"); 
div.remove(); 
$('body').append($(html)); 

var buttons = {"確定" : function () { 
if(okCallback) okCallback(); 
$(this).dialog("close"); 
} 
}; 

$("#"+type+"Div").dialog({ 
modal : true, 
title : title, 
buttons : buttons 
}); 

} 