自带的confirm无法对按钮文字进行修改,可以自定义一个层
<p><input onclick="msgbox('提示','请至少选择一项需要删除的记录!','',null,0,'Warning')" type="button" value="提示" />
<input onclick="msgbox('提示','操作执行成功!','',null,0,'true')" type="button" value="操作成功" />
<input onclick="msgbox('提示','操作执行失败!','',null,0,'error')" type="button" value="操作失败" />
<input onclick="msgbox('确认删除么?','点击确认执行删除操作,点击取消不再执行操作!','msgbox(\'操作提示\',\'删除成功!\',\'\',null,0,\'true\')',1,1,'Warning')" type="button" value="confirm" />
</p>
<script type="text/javascript" language="javascript">// <![CDATA[
function msgbox(title,content,func,cancel,focus,icon){
/*
参数列表说明:
title :弹出对话框的标题,标题内容最好在25个字符内,否则会导致显示图片的异常
text :弹出对话框的内容,可以使用HTML代码,例如<font color='red'>删除么?</font>,如果直接带入函数,注意转义
func :弹出对话框点击确认后执行的函数,需要写全函数的引用,例如add(),如果直接带入函数,注意转义。
cancel:弹出对话框是否显示取消按钮,为空的话不显示,为1时显示
focus :弹出对话框焦点的位置,0焦点在确认按钮上,1在取消按钮上,为空时默认在确认按钮上
icon :弹出对话框的图标
Author:Jedliu
Blog :Jedliu.cublog.cn
【网页转载请保留版权信息,实际使用时可以除去该信息】
*/
icon="http://images.cnblogs.com/cnblogs_com/IT-Bear/365886/t_msgbox_"+icon+".png"
create_mask()
var temp="<div style=\"width:300pxborder: 2px solid #37B6D1background-color: #fff font-weight: boldfont-size: 12px\" >"
+"<div style=\"line-height:25px padding:0px 5px background-color: #37B6D1\">"+title+"</div>"
+"<table cellspacing=\"0\" border=\"0\"><tr><td style=\" padding:0px 0px 0px 20px \"><img src=\""+icon+"\" width=\"64\" height=\"64\"></td>"
+"<td ><div style=\"background-color: #fff font-weight: boldfont-size: 12pxpadding:20px 0px text-align:left\">"+content
+"</div></td></tr></table>"
+"<div style=\"text-align:center padding:0px 0px 20pxbackground-color: #fff\"><input type='button' style=\"border:1px solid #CCC background-color:#CCC width:50px height:25px\" value='确定'id=\"msgconfirmb\" onclick=\"remove()"+func+"\">"
if(null!=cancel){temp+=" <input type='button' style=\"border:1px solid #CCC background-color:#CCC width:50px height:25px\" value='取消' id=\"msgcancelb\" onClick='remove()'>"}
temp+="</div></div>"
create_msgbox(400,200,temp)
if(focus==0||focus=="0"||null==focus){document.getElementById("msgconfirmb").focus()}
else if(focus==1||focus=="1"){document.getElementById("msgcancelb").focus()}
}
function get_width(){
return (document.body.clientWidth+document.body.scrollLeft)
}
function get_height(){
return (document.body.clientHeight+document.body.scrollTop)
}
function get_left(w){
var bw=document.body.clientWidth
var bh=document.body.clientHeight
w=parseFloat(w)
return (bw/2-w/2+document.body.scrollLeft)
}
function get_top(h){
var bw=document.body.clientWidth
var bh=document.body.clientHeight
h=parseFloat(h)
return (bh/2-h/2+document.body.scrollTop)
}
function create_mask(){//创建遮罩层的函数
var mask=document.createElement("div")
mask.id="mask"
mask.style.position="absolute"
mask.style.filter="progid:DXImageTransform.Microsoft.Alpha(style=4,opacity=25)"//IE的不透明设置
mask.style.opacity=0.4//Mozilla的不透明设置
mask.style.background="black"
mask.style.top="0px"
mask.style.left="0px"
mask.style.width=get_width()
mask.style.height=get_height()
mask.style.zIndex=1000
document.body.appendChild(mask)
}
function create_msgbox(w,h,t){//创建弹出对话框的函数
var box=document.createElement("div")
box.id="msgbox"
box.style.position="absolute"
box.style.width=w
box.style.height=h
box.style.overflow="visible"
box.innerHTML=t
box.style.zIndex=1001
document.body.appendChild(box)
re_pos()
}
function re_mask(){
/*
更改遮罩层的大小,确保在滚动以及窗口大小改变时还可以覆盖所有的内容
*/
var mask=document.getElementById("mask")
if(null==mask)return
mask.style.width=get_width()+"px"
mask.style.height=get_height()+"px"
}
function re_pos(){
/*
更改弹出对话框层的位置,确保在滚动以及窗口大小改变时一直保持在网页的最中间
*/
var box=document.getElementById("msgbox")
if(null!=box){
var w=box.style.width
var h=box.style.height
box.style.left=get_left(w)+"px"
box.style.top=get_top(h)+"px"
}
}
function remove(){
/*
清除遮罩层以及弹出的对话框
*/
var mask=document.getElementById("mask")
var msgbox=document.getElementById("msgbox")
if(null==mask&&null==msgbox)return
document.body.removeChild(mask)
document.body.removeChild(msgbox)
}
function re_show(){
/*
重新显示遮罩层以及弹出窗口元素
*/
re_pos()
re_mask()
}
function load_func(){
/*
加载函数,覆盖window的onresize和onscroll函数
*/
window.onresize=re_show
window.onscroll=re_show
}
// ]]></script>
JavaScript的版本指的是执行JavaScript的运行环境(JS引擎)所遵循的ECMAScript标准.JavaScript是ECMAScript标准的一种实现,这个标准随着历史在不断演进.
最初的JS版本为1.0IE6时代典型的为3.1版本 IE9时代(最近几年)主流为5.1标准去年新版本6.0(准确名字是ES2015)标准发布,目前较新的浏览器都有部分支持下一个版本为7.0,预计明后年颁布.
不同版本增加扩展了不同的特性, 新版本向后兼容旧版本.所以有时候会出现某些代码在新浏览器中正常,旧浏览器中无法执行的问题.
1,reload 方法,该方法强迫浏览器刷新当前页面。语法:location.reload([bForceGet])
参数: bForceGet, 可选参数, 默认为 false,从客户端缓存里取当前页。true, 则以 GET 方式,从服务端取最新的页面, 相当于客户端点击 F5("刷新")
2,replace 方法,该方法通过指定URL替换当前缓存在历史里(客户端)的项目,因此当使用replace方法之后,你不能通过“前进”和“后退”来访问已经被替换的URL。
语法: location.replace(URL)
通常使用: location.reload() 或者是 history.go(0) 来做。
此方法类似客户端点F5刷新页面,所以页面method="post"时,会出现"网页过期"的提示。
因为Session的安全保护机制。
当调用 location.reload() 方法时, aspx页面此时在服务端内存里已经存在, 因此必定是 IsPostback 的。
如果有这种应用: 需要重新加载该页面,也就是说期望页面能够在服务端重新被创建,期望是 Not IsPostback 的。
这里,location.replace() 就可以完成此任务。被replace的页面每次都在服务端重新生成。
代码: location.replace(location.href)
返回并刷新页面:
location.replace(document.referrer)
document.referrer //前一个页面的URL
不要用 history.go(-1),或 history.back()来返回并刷新页面,这两种方法不会刷新页面。
附:
Javascript刷新页面的几种方法:
复制代码代码如下:
1,history.go(0)
2,location.reload()
3,location=location
4,location.assign(location)
5,document.execCommand('Refresh')
6,window.navigate(location)
7,location.replace(location)
8,document.URL=location.href
自动刷新页面的方法:
1,页面自动刷新:把如下代码加入<head>区域中
复制代码代码如下:
<meta http-equiv="refresh" content="20">
其中20指每隔20秒刷新一次页面.
2,页面自动跳转:把如下代码加入<head>区域中
复制代码代码如下:
<meta http-equiv="refresh" content="20url=http://www.jb51.net">
其中20指隔20秒后跳转到http://www.jb51.net页面
3,页面自动刷新js版
复制代码代码如下:
<script language="JavaScript">
function myrefresh()
{
window.location.reload()
}
setTimeout('myrefresh()',1000)//指定1秒刷新一次
</script>
4,JS刷新框架的脚本语句
复制代码代码如下:
//刷新包含该框架的页面用
<script language=JavaScript>
parent.location.reload()
</script>
//子窗口刷新父窗口
<script language=JavaScript>
self.opener.location.reload()
</script>
( 或 <a href="javascript:opener.location.reload()">刷新</a> )
//刷新另一个框架的页面用
<script language=JavaScript>
parent.另一FrameID.location.reload()
</script>
如果想关闭窗口时刷新或想开窗时刷新,在<body>中调用以下语句即可。
复制代码代码如下:
<body onload="opener.location.reload()">开窗时刷新
<body onUnload="opener.location.reload()">关闭时刷新
<script language="javascript">
window.opener.document.location.reload()
</script>
一、先来看一个简单的例子:
下面以三个页面分别命名为frame.html、top.html、bottom.html为例来具体说明如何做。
frame.html 由上(top.html)下(bottom.html)两个页面组成,代码如下:
复制代码代码如下:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE>frame </TITLE>
</HEAD>
<frameset rows="50%,50%">
<frame name=top src="top.html">
<frame name=bottom src="bottom.html">
</frameset>
</HTML>
现在假设top.html (即上面的页面) 有七个button来实现对bottom.html (即下面的页面) 的刷新,可以用以下七种语句,哪个好用自己看着办了。
top.html 页面的代码如下:
复制代码代码如下:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE>top.html </TITLE>
</HEAD>
<BODY>
<input type=button value="刷新1" onclick="window.parent.frames[1].location.reload()"><br>
<input type=button value="刷新2" onclick="window.parent.frames.bottom.location.reload()"><br>
<input type=button value="刷新3" onclick="window.parent.frames['bottom'].location.reload()"><br>
<input type=button value="刷新4" onclick="window.parent.frames.item(1).location.reload()"><br>
<input type=button value="刷新5" onclick="window.parent.frames.item('bottom').location.reload()"><br>
<input type=button value="刷新6" onclick="window.parent.bottom.location.reload()"><br>
<input type=button value="刷新7" onclick="window.parent['bottom'].location.reload()"><br>
</BODY>
</HTML>
下面是bottom.html页面源代码,为了证明下方页面的确被刷新了,在装载完页面弹出一个对话框。
复制代码代码如下:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE>bottom.html </TITLE>
</HEAD>
<BODY onload="alert('我被加载了!')">
<h1>This is the content in bottom.html.</h1>
</BODY>
</HTML>
解释一下:
复制代码代码如下:
1.window指代的是当前页面,例如对于此例它指的是top.html页面。
2.parent指的是当前页面的父页面,也就是包含它的框架页面。例如对于此例它指的是framedemo.html。
3.frames是window对象,是一个数组。代表着该框架内所有子页面。
4.item是方法。返回数组里面的元素。
5.如果子页面也是个框架页面,里面还是其它的子页面,那么上面的有些方法可能不行。
附:
Javascript刷新页面的几种方法:
1 history.go(0)
2 location.reload()
3 location=location
4 location.assign(location)
5 document.execCommand('Refresh')
6 window.navigate(location)
7 location.replace(location)
8 document.URL=location.href