效果图:
<html>
<head>
<title>对话框</title>
<linkrel="stylesheet"type="text/css"href="/modules/commons/css/dialog.css">
<scriptsrc="/modules/commons/js/prototype.js"></script>
<scriptsrc="/modules/commons/js/dialog.js"></script>
</head>
<body>
<divid="Contain">
<divid="ICO"style="position:absolute;left:0px;top:5px;"></div>
<divid="Message"></div>
<divid="Buttons"></div>
</div>
</body>
<script>
Event.observe(window,'load',function(){
//checkbaseconfigandparameter
varobjIn=window.dialogArguments
vararrBt=['确定:1','取消:0']
if(objIn){
if(objIn.ArrBt){
arrBt=objIn.ArrBt
}
if(objIn.Message){
$('Message').innerHTML=objIn.Message
}
}else{
alert('tellmewhatuwanttoletusertoconfirmoralertinformation')
return
}
//ico
varICO=$('ICO')
varimg=document.createElement('img')
if(objIn.ICO){
img.src=objIn.ICO
}else{
img.src=Dialog.Alert
}
ICO.appendChild(img)
//button
varButtons=$('Buttons')
arrBt.each(function(bt){
varinput=document.createElement('input')
input.type='button'
vararr=bt.split(':')
input.value=arr[0]
input.returnValue=arr[1]
input.onclick=ClickBt
Buttons.appendChild(input)
})
},false)
functionClickBt(){
window.returnValue=this.returnValue
window.close()
}
</script>
</html> 调用方法的封装
/**//*
-01-18lisqcustomdialog
useage:
<scriptsrc="/modules/commons/js/dialog.js"></script>
varobjIn={
Message:'yourmessage',
ArrBt:['保存:1','不保存:2','取消:3']
}
varobjOut=Dialog.Show(objIn)
if(objOut==1){
saveit
}elseif(objOut==2){
notsaveit
}elseif(objOut==3){
uclickcancle
}
*/
varDialog={
Show:function(objIn){
varurl='/Commons/Dialog.do'
varstyle='dialogHeight:110px;dialogWidth:250px;edge:Raised;scroll:no;center:Yes;help:No;resizable:no;status:no;'
returnwindow.showModalDialog(url,objIn,style)
},
Alert:'/modules/commons/images/alert.png',
Confirm:'/modules/commons/images/confirm.png',
Error:'/modules/commons/images/error.gif.png'
}