zoukankan
html css js c++ java
javascript 刷新技巧
声明:
最近越来越感觉JS的优越性,项目中用到关于框架页面刷新的方法,在网上搜索以后发现有许多不错的代码,但不是很齐全。于是,我索性从网络上搜集以后经过精心编排,整理了一下。
^
-
^
希望大家多多指教!
先来看一个简单的例子:
下面以三个页面分别命名为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 (即下面的页面) 的刷新,可以用以下七种语句,哪个好用自己看着办了。
语句1. window.parent.frames[
1
].location.reload();
语句2. window.parent.frames.bottom.location.reload();
语句3. window.parent.frames[
"
bottom
"
].location.reload();
语句4. window.parent.frames.item(
1
).location.reload();
语句5. window.parent.frames.item(
'
bottom
'
).location.reload();
语句6. window.parent.bottom.location.reload();
语句7. window.parent[
'
bottom
'
].location.reload();
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页面源代码,为了证明下方页面的确被刷新了,在装载完页面弹出一个对话框。
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
自动刷新页面的方法:
1
.页面自动刷新:把如下代码加入
<
head
>
区域中
<
meta http
-
equiv
=
"
refresh
"
content
=
"
20
"
>
其中20指每隔20秒刷新一次页面.
2
.页面自动跳转:把如下代码加入
<
head
>
区域中
<
meta http
-
equiv
=
"
refresh
"
content
=
"
20;url=http://www.wyxg.com
"
>
其中20指隔20秒后跳转到http:
//
www.wyxg.com页面
3
.页面自动刷新js版
<
script language
=
"
JavaScript
"
>
function myrefresh()
{
window.location.reload();
}
setTimeout(
'
myrefresh()
'
,
1000
);
//
指定1秒刷新一次
</
script
>
ASP.NET如何输出刷新父窗口脚本语句
1
.
this
.response.write(
"
<script>opener.location.reload();</script>
"
);
2
.
this
.response.write(
"
<script>opener.window.location.href = opener.window.location.href;</script>
"
);
3
. Response.Write(
"
<script language=javascript>opener.window.navigate(''你要刷新的页.asp'');</script>
"
)
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
>
查看全文
相关阅读:
coco2dx--Permission denied
在Winform中屏蔽UnityWebPlayer的右键以及自带Logo解决方案整理
Setup Factory 程序打包
T—SQL用法剪辑,方便以后查看
如何用asp.net MVC框架、highChart库从sql server数据库获取数据动态生成柱状图
微软ASP.NET MVC 学习地址
一个用WPF做的简单计算器源代码
wpMVVM模式绑定集合的应用
windows phone上下文菜单ContextMenu的使用示例
CListCtrl 防止闪烁,调整行显示长度
原文地址:https://www.cnblogs.com/wubiyu/p/1081688.html
最新文章
E8.Net工作流注册问题
TX Text Control的样式表使用技巧
TX Text Control内测版本试用记
DevExpress Document Server加载保存与导出Excel
DevExpress Document Server的Spreadsheet对象模型详解
文档操作库DevExpress Document Server试用心得
巧用报表工具API的一个示例
谈一下Silverlight报表的打印
Windows Phone 8移动应用开发工具盘点——开发框架篇
Windows Phone 8移动应用开发工具盘点——界面篇
热门文章
Windows Phone 8移动应用开发工具盘点——基础篇
Migrate to AndroidX 遇到的坑
国际化地区语言码对照表(i18n)
Flutter 宽高比(比率)控件 AspectRatio
Flutter 增加三方库卡在flutter package get 的解决办法
Webstorm快捷键
Service must be explitict android 5.0问题
Android Studio中设置与Eclipse中 Ctrl+1 功能类似的快捷键
Android Studio代码错误提示无效(not available in Power Save mode)
android studio下 library打包文件(.aar)和本地引用
Copyright © 2011-2022 走看看