2012年12月25日星期二

用 jQuery 覆盖 alert、confirm 函数的样式

/**
 * 覆盖默认的alert样式
 * @param message 要显示的内容
 * @param title 标题
 */
function alert(messagetitle,width,height{
    var title title || "提示";
    var width width || "300";
    var height height || "180";
    var obj $('div[id=dialog_alert]').size($('#dialog_alert'$('<div/>'{
        id "dialog_alert"
    });
  
    if ($.ui.dialog{
        if (obj.dialog("isOpen"){
            obj.dialog("close");
        }
        obj.html(message).dialog({
            title title,
            width:width,
            height:height,
            close:function(){
                $(this).dialog('destriy');
            }
        });
    else {
        alert(message);
    }
}
/**
 * 使用jquery ui 模拟javascript confirm功能
 
 * @param string
 *            message 内容
 * @param function
 *            callback 点击确认执行的函数
 * @param function
 *            closeCallback 点击取消执行的函数
 * @return boole false
 */
function myConfirm(messagecallbackcloseCallback{
    if (!$.isFunction(callback){
        try{
            console.error('第二个参数请传递一个函数');
        }catch(e){}
    
        return false;
    }
    if (!$('#dialog-follow').length{
        $('body').append('<div id="dialog-follow"></div>"');
    }
    if ($.isFunction($("#dialog-follow").dialog){
        $("#dialog-follow").dialog({
            width 300,
            modal true,
            resizable false,
            title '温馨提示',
            buttons {
                "确定" function({
                    callback();
                    $(this).dialog("close");
                },
                "取消" function({
                    $(this).dialog("close");
                    if ($.isFunction(closeCallback){
                        closeCallback();
                    }
                }
            }
        });
        $("#dialog-follow").html(message);
    else {
        if (confirm(message){
            callback();
        }
    }
    return false;
}

没有评论:

发表评论