iframe调用父页面函数示例详解


Posted in Javascript onJuly 17, 2014
window.parent.xxxxx();//xxxxx()代表父页面方法

具体列子如下,其中包括easyUI的右键和单击事件

parent.jsp

body部分代码

<body class="easyui-layout"> 
<!-- 左侧目录 --> 
<div 
data-options="region:'west',split:true,title:'主题',iconCls:'icon-arrowIn'" 
style="width: 270px; background: #efefef"> 
<!-- 目录数 --> 
<ul id="tree" class="easyui-tree"></ul> 
</div> 
<input type="hidden" value="${param.type }" id="themeType"/> 
<!-- 右侧窗体 --> 
<div 
data-options="region:'center',title:'内容显示',iconCls:'icon-arrowOut'" style="overflow: hidden"> 
<iframe name="leftIframe" id="leftIframe" src="" frameborder="0" height="100%" width="100%"></iframe> 
</div> 
<!-- 右键菜单 --> 
<div id=rightCliMean class="easyui-menu" style="width:120px;"> 
<div onclick="updateTheme();" data-options="iconCls:'icon-edit'" >修改</div> 
<div onclick="removeObjectNode();" data-options="iconCls:'icon-tip'" >删除</div> 
</div> 
<script type="text/javascript"> 
loadTree(); 
</script> 
</body>

js部分:

function loadTree() { 
$('#tree').tree( { 
url : 'xxxxx.action, 
animate : true, 
lines : true, 
onContextMenu : function(e, node) { 
e.preventDefault(); 
$(this).tree('select', node.target); 
/** 
* 不可以对根节点(默认主题)进行操作 
*/ 
var parent = $(this).tree('getParent',node.target); 
if(parent){ 
if(node.text == '默认主题'){ 
$.messager.alert("提示信息","默认主题不能进行操作!","warning"); 
return false; 
} 

$('#rightCliMean').menu('show',{ 
left: e.pageX, 
top: e.pageY 
}); 
} 
}, 
onClick:function(node) {//单机事件 
var type = node.attributes.type; 
if("Schema" == type){ 
var themeType = $("#themeType").val(); 
$('#leftIframe').attr('src', 'xxxx.action'); 
return; 
} 
} 
}); 
} 
child.jsp
/** 
* 刷新左侧主题 
*/ 
$(function(){ 
window.parent.loadTree(); 
})
Javascript 相关文章推荐
jQuery DOM操作小结与实例
Jan 07 Javascript
jQuery 验证插件 Web前端设计模式(asp.net)
Oct 17 Javascript
判断输入是否为空,获得输入类型的JS代码
Oct 30 Javascript
javascript函数作用域学习示例(js作用域)
Jan 13 Javascript
javascript中使用new与不使用实例化对象的区别
Jun 22 Javascript
想学习javascript JS和jQuery哪个重要 先学哪个
Dec 11 Javascript
canvas实现流星雨的背景效果
Jan 13 Javascript
JS生成一维码(条形码)功能示例
Jan 19 Javascript
Node.js  REPL (交互式解释器)实例详解
Aug 06 Javascript
JavaScript 数组去重并统计重复元素出现的次数实例
Dec 14 Javascript
通过循环优化 JavaScript 程序
Jun 24 Javascript
Ajax是什么?Ajax高级用法之Axios技术
Apr 21 Javascript
js中一维数组和二位数组中的几个问题示例说明
Jul 17 #Javascript
js中函数调用的两种常用方法使用介绍
Jul 17 #Javascript
jQuery中关于ScrollableGridPlugin.js(固定表头)插件的使用逐步解析
Jul 17 #Javascript
Express.JS使用详解
Jul 17 #Javascript
JavaScript DOM节点添加示例
Jul 16 #Javascript
js中各种类型的变量在if条件中是true还是false
Jul 16 #Javascript
JQuery做的一个简单的点灯游戏分享
Jul 16 #Javascript
You might like
虫族 ZERG 概述
2020/03/14 星际争霸
PHP实现链表的定义与反转功能示例
2018/06/09 PHP
PHP时间日期增减操作示例【date strtotime实现加一天、加一月等操作】
2018/12/21 PHP
JavaScript使用技巧精萃[代码非常实用]
2008/11/21 Javascript
input 高级限制级用法
2009/03/26 Javascript
深入分析jquery解析json数据
2014/12/09 Javascript
vue,angular,avalon这三种MVVM框架优缺点
2016/04/27 Javascript
BootStrap的JS插件之轮播效果案例详解
2016/05/16 Javascript
深入解析JavaScript中的arguments对象
2016/06/12 Javascript
jQuery操作iframe中js函数的方法小结
2016/07/06 Javascript
element-ui table组件如何使用render属性的实现
2019/11/04 Javascript
高性能js数组去重(12种方法,史上最全)
2019/12/21 Javascript
vue.js this.$router.push获取不到params参数问题
2020/03/03 Javascript
JavaScript仿京东秒杀倒计时
2020/03/17 Javascript
简洁的十分钟Python入门教程
2015/04/03 Python
python安装cx_Oracle模块常见问题与解决方法
2017/02/21 Python
利用python模拟sql语句对员工表格进行增删改查
2017/07/05 Python
python中hashlib模块用法示例
2017/10/30 Python
python批量替换页眉页脚实例代码
2018/01/22 Python
DES加密解密算法之python实现版(图文并茂)
2018/12/06 Python
浅谈python3发送post请求参数为空的情况
2018/12/28 Python
PyTorch加载自己的数据集实例详解
2020/03/18 Python
Python发送邮件实现基础解析
2020/08/14 Python
python编写实现抽奖器
2020/09/10 Python
HTML5应用之文件上传
2016/12/30 HTML / CSS
a标签下载链接的简单实现
2016/09/13 HTML / CSS
维多利亚的秘密官方旗舰店:VICTORIA’S SECRET
2018/04/02 全球购物
安全的后院和健身蹦床:JumpSport
2019/07/15 全球购物
C#中的验证控件有几种
2014/03/08 面试题
什么是用户模式(User Mode)与内核模式(Kernel Mode) ?
2015/09/07 面试题
教你打造完美的创业计划书
2014/01/06 职场文书
旅游网创业计划书
2014/01/31 职场文书
教师师德承诺书
2014/03/26 职场文书
laravel ajax curd 搜索登录判断功能的实现
2021/04/17 PHP
吃通javascript正则表达式
2021/04/21 Javascript
pytorch中Schedule与warmup_steps的用法说明
2021/05/24 Python