- ·上一篇文章:jquery获取当前类在第几个li上面
- ·下一篇文章:javascript等比压缩图片
js模拟confirm功能,并去掉它灰色的界面
整天对着灰色的confirm和alert对话框,厌恶了,今天要彻底地改变一下这两个对话框,且功能照旧。
这里是使用js来实现这个效果
<
html>
<
head>
<
meta http-equiv="Content-Type" content="text/html
charset=gb2312" />
<
title>
js模拟confirm和alert功能<
/title>
<
script>
/*
************************************
功能:js模拟confirm、alert效果,改变
它们原始那些灰色的样子
来源:网络
整理:www.aspprogram.cn
************************************
*/
function clk_yes()
{
 
 
 
alert("这是confirm效果")
}
function clk_no()
{
 
 
 
alert("这不是confirm效果")
}
var alternateFrame=null
//生成的iframe
var alternateWin=null
window.alert=showAlert
window.confirm=showConfirm
var IsIE=document.all
function alternateWindow()
{
this.win=null
//生成对话框的窗口对象
this.pBody=null
//生成的body容器对象
this.pBg=null
this.type="alert"
//默认的种类是alert
this.FocusWhere="OK"
//焦点在哪个按钮上
}
function showAlert(info)
{
alternateWin=new alternateWindow()
var pBody = alternateWin.init()
alternateWin.initAlertBody(pBody,info)
alternateWin.type="alert"
}
function showConfirm(info,ok_func,notok_func,ok_str,not_okstr)
{
alternateWin=new alternateWindow()
var pBody = alternateWin.init()
alternateWin.initConfirmBody(pBody,info,ok_func,notok_func,ok_str,not_okstr)
alternateWin.type="confirm"
}
alternateWindow.prototype.init=function()
{
if(alternateFrame==null)
{
/*alternateFrame=document.createElement("<
iframe allowTransparency='true' id='popframe' "
+"frameborder=0 marginheight=0 src='about:blank' marginwidth=0 hspace=0 vspace=0 scrolling=no>
<
/iframe>
")*/
//上面的ff不能兼容
alternateFrame=document.createElement("iframe")
//alternateFrame.allowTransparency='true'
//这个没有什么用啊...........
alternateFrame.id='popframe'
alternateFrame.frameborder=0
alternateFrame.marginheight=0
alternateFrame.vspace=0
alternateFrame.hspace=0
alternateFrame.scrolling="no"
alternateFrame.src='about:blank'
alternateFrame.style.position="absolute"
document.body.appendChild(alternateFrame)
}else
{
alternateFrame.style.visibility="visible"
}
//ff设置位置时要把单位加上
alternateFrame.style.width=screen.availWidth+"px"
alternateFrame.style.height=screen.availHeight+"px"
alternateFrame.style.left=document.body.scrollLeft+"px"
alternateFrame.style.top=document.body.scrollTop+"px"
//alternateFrame.name=alternateFrame.uniqueID
//ff下iframe不支持uniqueID属性
alternateFrame.name="popframe"
//this.win=window.frames[alternateFrame.name]
//=========
this.win=IsIE?window.frames[alternateFrame.name]:document.getElementById("popframe").contentWindow
this.win.document.write("<
body leftmargin=0 topmargin=0 oncontextmenu='self.event.returnValue=false'>
<
div id=popbg>
<
/div>
<
div id=popbody>
<
/div>
<
div>
<
/div>
<
/body>
")
this.win.document.body.style.backgroundColor="transparent"
document.body.style.overflow="hidden"
//=============下面两句
this.pBody=IsIE?this.win.document.body.children[1]:this.win.document.getElementById("popbody")
this.pBg=IsIE?this.win.document.body.children[0]:this.win.document.getElementById("popbg")
this.hideAllSelect()
this.initBg()
return this.pBody
}
 
/**
* 作用:初始化背景层
 
*/
 
//=============ff的滤镜播放效果的支持知道怎么搞
alternateWindow.prototype.initBg=function()
{
with(this.pBg.style)
{
position="absolute"
left="0"
top="0"
width="100%"
height="100%"
visibility="hidden"
backgroundColor="
#000000"
if(IsIE)
 
filter="blendTrans(duration=1) alpha(opacity=30)"
//==========
else//ff下的blendTrans滤镜好象不支持,反正是不知道了
 
opacity="0.3"
//透明度这样设置,是ff时 
}
if(IsIE) this.pBg.filters.blendTrans.apply()
this.pBg.style.visibility="visible"
if(IsIE) this.pBg.filters.blendTrans.play()
}
/**
 
* 作用:初始化显示层
 
*/
alternateWindow.prototype.initAlertBody=function(obj,info)
{
with(obj.style)
{
position="absolute"
width="400"
height="150"
backgroundColor="
#ffffff"
}
obj.style.left=window.document.body.clientWidth/2-200
obj.style.top=window.document.body.clientHeight/10
var str
str ="<
table border=0 cellpadding=0 cellspacing=1 bgcolor=
#00ff00 width=100% height=100%>
<
tr height=30>
"
str+="<
td align=left style='color:
#e1dfdf
font-size:14px
font-weight:bold' bgcolor=
#119035>
【新闻详细】<
span id=newstitle>
<
/span>
<
/td>
<
/tr>
"
str+="<
tr>
<
td align=center bgcolor=
#81FB8D style='font-size:12px
color:
#454545
vertical-align: top
padding-top:5px
'>
"
str+=info+"<
/td>
<
/tr>
<
tr height=40 bgcolor=
#81FB8D>
<
td align=center>
" +
 
 
 
 
"<
input type='button' value='关 闭' id='AlertOK'" +//这里id要注意唯一
 
 
 
 
" "+
 
 
 
 
" >
" +
 
 
 
 
"<
/td>
<
/tr>
<
/table>
"
obj.innerHTML=str
//这句话有问题,ff不支持all
if(IsIE)this.win.document.body.all.AlertOK.focus()
else this.win.document.getElementById("AlertOK")
this.FocusWhere="OK"
}
alternateWindow.prototype.onKeyDown=function(event,obj)
{
 
switch(event.keyCode)
{
 
case 9://tab键
 
//这里事件对象属性和方法使用没加与区别
 
if(IsIE) event.keyCode=-1
else event.preventDefault()
 
if(this.type=="confirm")
{
 
if(this.FocusWhere=="OK")
{
 
if(IsIE)
 
&nbs
js模拟confirm功能,并去掉它灰色的界面