javascript跨域刷新实现代码


Posted in Javascript onJanuary 01, 2011

三个页在同一个窗口,分别为main.htm,left.htm和right.htm。
main.htm

<html> 
<head> 
<title>实现跨</title> 
</head> 
<body> 
<div>主窗口</div> 
<iframe id="left" name="left" width="500px" height="300px;" src="left.htm" ></iframe> 
<iframe id="right" name="right" width="100px" height="100px;" src="right.htm" ></iframe> 
</body> 
</html>

left.htm
<html> 
<head><title>左边</title></head> 
<body> 
<div>我是左边</div> 
<div><img src="http://www.enjoymyself.info/images/buysc.jpg" alt=" " /></div> 
</body> 
</html>

right.htm
<html> 
<head><title>右边</title></head> 
<body> 
<div> 
<input onclick="onclickRefresh();" type="button" value="提交" /></div> 
<script type="text/javascript"> 
function onclickRefresh() 
{ 
parent.frames[ "left"].location.reload(); 
//window.left.location.reload(); 
} 
</script> 
</body> 
</html>

看到right.htm里面
function onclickRefresh()通过 parent.frames["left"].location.refresh();来实现右边页面刷新左边页面.
如果在主页面加
<div><input type="button" onclick="mainRefresh();" value="主提交" /></div> 
<script type="text/javascript"> 
function mainRefresh() 
{ 
window.left.location.reload(); 
} 
</script>

则可以通过主页面刷新子页面。
虽然这样可以超级简单的实现的目的,但是实际项目中,数据不会是这么简单的,最常见是左\右树,目录树的创建加载(如创建一千个节点)本来就是比较耗资源。如果还是通过方式来刷新左右页面,效率之低可见而知,那么是不是可以通过其他方式来实现跨域刷新或者提交呢?
我所想到的是通过ajax实现数据局部加载。而不是整个树的加载。另外通过jquery的json处理方式也可实现局部数据的更新。
不知道还有没有其他更高效的方法?1000个节点的树加载,效率值得思考的问题。
Javascript 相关文章推荐
Ext.MessageBox工具类简介
Dec 10 Javascript
html中的input标签的checked属性jquery判断代码
Sep 19 Javascript
基于jquery实现的树形菜单效果代码
Sep 06 Javascript
jQuery实现点击查看大图并以弹框的形式居中
Aug 08 Javascript
Vue.js实战之组件的进阶
Apr 04 Javascript
Ionic项目中Native Camera的使用方法
Jun 07 Javascript
AngularJS实现进度条功能示例
Jul 05 Javascript
nginx+vue.js实现前后端分离的示例代码
Feb 12 Javascript
JavaScript显式数据类型转换详解
Mar 18 Javascript
JS数组方法concat()用法实例分析
Jan 18 Javascript
详解js中的几种常用设计模式
Jul 16 Javascript
antd多选下拉框一行展示的实现方式
Oct 31 Javascript
extjs中grid中嵌入动态combobox的应用
Jan 01 #Javascript
js注意img图片的onerror事件的分析
Jan 01 #Javascript
JavaScript 计算图片加载数量的代码
Jan 01 #Javascript
jQuery jqgrid 对含特殊字符json 数据的 Java 处理方法
Jan 01 #Javascript
基于jQuery架构javascript基础体系
Jan 01 #Javascript
jQuery技巧总结
Jan 01 #Javascript
js中查找最近的共有祖先元素的实现代码
Dec 30 #Javascript
You might like
PHP MYSQL乱码问题,使用SET NAMES utf8校正
2009/11/30 PHP
php源代码安装常见错误与解决办法分享
2013/05/28 PHP
详解PHP执行定时任务的实现思路
2015/12/21 PHP
PHP使用mysql与mysqli连接Mysql数据库用法示例
2016/07/07 PHP
php 判断页面或图片是否经过gzip压缩的方法
2017/04/05 PHP
PHP策略模式定义与用法示例
2017/07/27 PHP
php时间戳转换代码详解
2019/08/04 PHP
IE6/7/8中Option元素未设value时Select将获取空字符串
2011/04/07 Javascript
js变量以及其作用域详解
2020/07/18 Javascript
Javascript 命名空间模式
2013/11/01 Javascript
JavaScript设计模式之单例模式实例
2014/09/24 Javascript
浅谈javascript函数式编程
2015/09/06 Javascript
jQuery插件ajaxFileUpload使用实例解析
2016/10/19 Javascript
Windows系统下安装Node.js的步骤图文详解
2016/11/15 Javascript
vue底部加载更多的实例代码
2018/06/29 Javascript
ES6 fetch函数与后台交互实现
2018/11/14 Javascript
vue集成chart.js的实现方法
2019/08/20 Javascript
Layui弹出层 加载 做编辑页面的方法
2019/09/16 Javascript
解决vue+ element ui 表单验证有值但验证失败问题
2020/01/16 Javascript
小程序双头slider选择器的实现示例
2020/03/31 Javascript
Python写入CSV文件的方法
2015/07/08 Python
Python2.7简单连接与操作MySQL的方法
2016/04/27 Python
Python常用模块os.path之文件及路径操作方法
2019/12/03 Python
css3 background属性调整增强介绍
2010/12/18 HTML / CSS
SCDKey德国:全球领先的数字游戏市场
2019/04/09 全球购物
经理管理专业自荐信范文
2013/12/31 职场文书
母亲节演讲稿范文
2014/01/02 职场文书
园林技术个人的自我评价
2014/01/08 职场文书
党员干部承诺书范文
2014/03/25 职场文书
大专毕业生自我鉴定范文(2篇)
2014/09/27 职场文书
个人查摆问题整改措施
2014/10/04 职场文书
团委工作总结2015
2015/04/02 职场文书
2016年党员创先争优承诺书
2016/03/25 职场文书
在校大学生才艺比赛策划书怎么写?
2019/08/26 职场文书
python脚本框架webpy模板控制结构
2021/11/20 Python
vue 自定义的组件绑定点击事件
2022/04/21 Vue.js