源码:
<!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> <title></title>
<script type="text/javascript">
function MessageBox(){} 
MessageBox.alert = MessageBox$alert;MessageBox.confirm = MessageBox$confirm;MessageBox.create = MessageBox$create;MessageBox.setSize = MessageBox$setSize;MessageBox.close = MessageBox$close;MessageBox.divConfig= {'id':'div1','bgColor':'green','zIndex':1000}; MessageBox.tableConfig= { 'id':'table1', 'bgColor':'white', 'width':'250px', 'height':'100px', 'borderColor':'lightblue', 'titlebgColor':'aliceblue'
};function MessageBox$alert( message ,callBack ){ MessageBox.create( message ); var btn = document.createElement('input'); btn.type = 'button'; btn.value = '确定'; if( callBack != null ) { btn.attachEvent('onclick',function(){MessageBox.close();callBack();}); } else { btn.attachEvent('onclick',function(){MessageBox.close();}); } var table = document.getElementById(MessageBox.tableConfig['id']); table.rows[2].cells[0].innerHTML = ''; table.rows[2].cells[0].appendChild(btn);}function MessageBox$confirm( message,callBack ){ MessageBox.create( message ); var btnOK = document.createElement('input'); btnOK.type = 'button'; btnOK.value = '确定'; btnOK.style.marginRight = '10px'; if( callBack != null ) { btnOK.attachEvent('onclick',function(){MessageBox.close();callBack( true );}); } else { btnOK.attachEvent('onclick',function(){MessageBox.close();}); } var btnCANCEL = document.createElement('input'); btnCANCEL.type = 'button'; btnCANCEL.value = '取消'; if( callBack != null ) { btnCANCEL.attachEvent('onclick',function(){MessageBox.close();callBack( false );}); } else { btnCANCEL.attachEvent('onclick',function(){MessageBox.close();}); } var table = document.getElementById(MessageBox.tableConfig['id']); table.rows[2].cells[0].innerHTML = ''; table.rows[2].cells[0].appendChild(btnOK); table.rows[2].cells[0].appendChild(btnCANCEL);}function MessageBox$create( message ){ var divId = MessageBox.divConfig['id']; var tableId = MessageBox.tableConfig['id']; var div = document.getElementById( divId ); var table = document.getElementById(tableId); var divConfig = MessageBox.divConfig; var tableConfig = MessageBox.tableConfig; if( div == null ) { div = document.createElement('<div style="filter:alpha(opacity=40);position:absolute;top:0px;left:0px;"></div>'); div.id = divId; div.style.backgroundColor = divConfig['bgColor']; div.style.zIndex = divConfig['zIndex']; document.body.appendChild( div ); var frame = document.createElement('<iframe style="filter:alpha(opacity=0);position:absolute;left:0px; top:0px; border-style:none;100%;height:100%;"></iframe>'); frame.style.zIndex = divConfig['zIndex']-1; div.appendChild( frame ); var contentH = parseFloat( tableConfig['height'] ) - 50; var strHTML = '<table id="'+tableId+'" style="position: absolute; filter : progid:DXImageTransform.Microsoft.DropShadow(color=#666666,offX=3,offY=3,positives=true);font-size:12px; border: '+ tableConfig['borderColor'] +' 1px solid; " cellpadding="2" cellspacing="0">' +'<tr>' + '<td style="height:20px; background-color: '+tableConfig['titlebgColor']+';">提示信息' + '</td>' +'</tr>' +'<tr>' + '<td style="height:'+contentH+'px;text-align:center;word-break:break-all;">' + '</td>' +'</tr>' +'<tr>' + '<td style="height:30px;text-align:center;">' +'</tr>' +'</table>'; document.body.insertAdjacentHTML('afterBegin',strHTML); table = document.getElementById( tableId ); table.style.backgroundColor = tableConfig['bgColor']; table.style.width = tableConfig['width']; table.style.height = tableConfig['height']; table.style.zIndex = divConfig['zIndex'] + 1; } div.style.display = ''; table.style.display = ''; table.rows[1].cells[0].innerHTML = message; MessageBox.setSize(div,table); window.attachEvent("onresize", function(){ MessageBox.setSize(div,table) } ); window.attachEvent("onscroll", function(){ MessageBox.setSize(div,table) } ); }function MessageBox$setSize(div,table){ var sw = parseFloat(document.documentElement.scrollWidth); var cw = parseFloat(document.documentElement.clientWidth); var sh = parseFloat(document.documentElement.scrollHeight); var ch = parseFloat(document.documentElement.clientHeight); div.style.width = sw >= cw?sw:cw; div.style.height= sh >= ch?sh:ch; table.style.left = parseFloat(document.documentElement.scrollLeft) + cw/2 - parseFloat(table.clientWidth)/2; table.style.top = parseFloat(document.documentElement.scrollTop) + ch/2 - parseFloat(table.clientHeight)/2;}function MessageBox$close(){ document.getElementById(MessageBox.tableConfig['id']).style.display = 'none'; document.getElementById(MessageBox.divConfig['id']).style.display = 'none'; }//==============================================================================================================function t(){ MessageBox.confirm('are you exit?',h);}function h( r ){ alert('你选的结果是:' + r );}
</script></head><body > <form id="id" action=""> <button id="btn" onclick="MessageBox.alert('hello world!',function(){alert('你点我了')});"> Click Me</button> <input id="Button1" type="button" value="Click Me" onclick="t()" /> <select id="Select1"> <option selected="selected"></option> </select> asdfasd </form></body></html>