js重写window.alert

r囧r小猫 2021-06-24 13:58 462阅读 0赞

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
<html xmlns="http://www.w3.org/1999/xhtml">  
<head>  
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />  
    <title>重写alert</title>  
    <link  href="css/style.css" rel="stylesheet"/>  
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js"></script>  
    <script type="text/javascript">  
    var showAlert = function(msg)\{   
        jAlert(msg, "提示！");  
    \}  
    window.alert=showAlert;

$.alerts=\{  
        verticalOffset:-75,horizontalOffset:0,repositionOnResize:true,overlayOpacity:.01,overlayColor:'\#FFF',draggable:true,okButton:' OK ',cancelButton:' Cancel ',dialogClass:null,alert:function(message,title,callback)\{  
            if(title==null)title='Alert';  
            $.alerts.\_show(title,message,null,'alert',function(result)\{  
                if(callback)callback(result)  
            \})  
        \}  
        ,\_show:function(title,msg,value,type,callback)\{  
            $.alerts.\_hide();  
            $.alerts.\_overlay('show');  
            $("BODY").append('<div id="popup\_container">'+'<h1 id="popup\_title"></h1>'+'<div id="popup\_content">'+'<div id="popup\_message"></div>'+'</div>'+'</div>');  
            if($.alerts.dialogClass)$("\#popup\_container").addClass($.alerts.dialogClass);  
            var pos=($.browser.msie&&parseInt($.browser.version)<=6)?'absolute':'fixed';  
            $("\#popup\_container").css(\{  
                position:pos,zIndex:99999,padding:0,margin:0  
            \});  
            $("\#popup\_title").text(title);  
            $("\#popup\_content").addClass(type);  
            $("\#popup\_message").text(msg);  
            $("\#popup\_message").html($("\#popup\_message").text().replace(/\\n/g,'<br />'));  
            $("\#popup\_container").css(\{  
                minWidth:$("\#popup\_container").outerWidth(),maxWidth:$("\#popup\_container").outerWidth()  
            \});  
            $.alerts.\_reposition();  
            $.alerts.\_maintainPosition(true);  
            switch(type)\{  
                case'alert':$("\#popup\_message").after('<div id="popup\_panel"><input type="button" value="'+$.alerts.okButton+'" id="popup\_ok" /></div>');  
                $("\#popup\_ok").click(function()\{  
                    $.alerts.\_hide();  
                    callback(true)  
                \});  
                $("\#popup\_ok").focus().keypress(function(e)\{  
                    if(e.keyCode==13||e.keyCode==27)$("\#popup\_ok").trigger('click')  
                \});  
                break  
            \};  
            if($.alerts.draggable)\{  
                try\{  
                    $("\#popup\_container").draggable(\{  
                        handle:$("\#popup\_title")  
                    \});  
                    $("\#popup\_title").css(\{  
                        cursor:'move'  
                    \})  
                \}  
                catch(e)\{\}  
            \}  
        \}  
        ,\_hide:function()\{  
            $("\#popup\_container").remove();  
            $.alerts.\_overlay('hide');  
            $.alerts.\_maintainPosition(false)  
        \}  
        ,\_overlay:function(status)\{  
            switch(status)\{  
                case'show':$.alerts.\_overlay('hide');  
                $("BODY").append('<div id="popup\_overlay"></div>');  
                $("\#popup\_overlay").css(\{  
                    position:'absolute',zIndex:99998,top:'0px',left:'0px',width:'100%',height:$(document).height(),background:$.alerts.overlayColor,opacity:$.alerts.overlayOpacity  
                \});  
                break;  
                case'hide':$("\#popup\_overlay").remove();  
                break  
            \}  
        \}  
        ,\_reposition:function()\{  
            var top=(($(window).height()/ 2) - ($("\#popup\_container").outerHeight() /2))+$.alerts.verticalOffset;  
            var left=(($(window).width()/ 2) - ($("\#popup\_container").outerWidth() /2))+$.alerts.horizontalOffset;  
            if(top<0)top=0;  
            if(left<0)left=0;  
            if($.browser.msie&&parseInt($.browser.version)<=6)top=top+$(window).scrollTop();  
            $("\#popup\_container").css(\{  
                top:top+'px',left:left+'px'  
            \});  
            $("\#popup\_overlay").height($(document).height())  
        \}  
        ,\_maintainPosition:function(status)\{  
            if($.alerts.repositionOnResize)\{  
                switch(status)\{  
                    case true:$(window).bind('resize',function()\{  
                        $.alerts.\_reposition()  
                    \});  
                    break;  
                    case false:$(window).unbind('resize');  
                    break  
                \}  
            \}  
        \}  
    \};  
    jAlert=function(message,title,callback)\{  
        $.alerts.alert(message,title,callback)  
    \}

$(function()\{alert("hello word！")\})  
    </script>  
    <style>  
    \#popup\_container\{font-family:Arial,sans-serif;font-size:12px;min-width:300px;max-width:600px;background:\#FFF;border:solid 5px \#999;color:\#000;-moz-border-radius:5px;-webkit-border-radius:5px;border-radius:5px;\}\#popup\_title\{font-size:14px;font-weight:bold;text-align:center;line-height:1.75em;color:\#666;background:\#CCC url(images/title.gif) top repeat-x;border:solid 1px \#FFF;border-bottom:solid 1px \#999;cursor:default;padding:0em;margin:0em;\}\#popup\_content\{background:16px 16px no-repeat url(images/info.gif);padding:1em 1.75em;margin:0em;\}\#popup\_content.alert\{background-image:url(images/info.gif);\}\#popup\_message\{padding-left:48px;\}\#popup\_panel\{text-align:center;margin:1em 0em 0em 1em;\}\#popup\_prompt\{margin:.5em 0em;\}  
    </style>  
</head>  
<body>  
</body>  
</html>