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 相关文章推荐
[原创]静态页面也可以实现预览 列表不同的显示方式
Oct 14 Javascript
超棒的javascript页面顶部卷动广告效果
Dec 01 Javascript
js或者jquery判断图片是否加载完成实现代码
Mar 20 Javascript
Javascript表格翻页效果的具体实现
Oct 05 Javascript
Javascript的&amp;&amp;和||的另类用法
Jul 23 Javascript
js添加select下默认的option的value和text的方法
Oct 19 Javascript
jquery.validate使用时遇到的问题
May 25 Javascript
Jquery日期选择datepicker插件用法实例分析
Jun 08 Javascript
js中class的点击事件没有效果的解决方法
Oct 13 Javascript
JS实现重新加载当前页面
Nov 29 Javascript
微信小程序导航栏跟随滑动效果的实现代码
May 14 Javascript
JS实现打字游戏
Dec 17 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
PHP快速按行读取CSV大文件的封装类分享(也适用于其它超大文本文件)
2014/04/10 PHP
用 Composer构建自己的 PHP 框架之设计 MVC
2014/10/30 PHP
js 判断浏览器类型 去全角、半角空格 自动关闭当前窗口
2009/04/10 Javascript
利用WebBrowser彻底解决Web打印问题(包括后台打印)
2009/06/22 Javascript
在页面中js获取光标/鼠标的坐标及光标的像素坐标
2013/11/11 Javascript
jquery实现带二级菜单的导航示例
2014/04/28 Javascript
jQuery的ready方法详解
2014/11/27 Javascript
jQuery中extend()和fn.extend()方法详解
2015/06/03 Javascript
Underscore源码分析
2015/12/30 Javascript
基于jQuery实现动态搜索显示功能
2016/05/05 Javascript
深入理解jquery中的事件与动画
2016/05/24 Javascript
jQuery事件绑定用法详解
2016/09/08 Javascript
BootStrap入门教程(一)之可视化布局
2016/09/19 Javascript
JavaScript中定义对象原型的两种使用方法
2016/12/15 Javascript
Mint UI 基于 Vue.js 移动端组件库
2017/11/07 Javascript
javaScript canvas实现(画笔大小 颜色 橡皮的实例)
2017/11/28 Javascript
vue中对象数组去重的实现
2020/02/06 Javascript
Vue 使用iframe引用html页面实现vue和html页面方法的调用操作
2020/11/16 Javascript
python str与repr的区别
2013/03/23 Python
python中的多重继承实例讲解
2014/09/28 Python
Python统计python文件中代码,注释及空白对应的行数示例【测试可用】
2018/07/25 Python
PyGame贪吃蛇的实现代码示例
2018/11/21 Python
python调试神器PySnooper的使用
2019/07/03 Python
python实现图像拼接
2020/03/05 Python
keras K.function获取某层的输出操作
2020/06/29 Python
Linux管理员面试经常问道的相关命令
2014/12/12 面试题
第一批党的群众路线教育实践活动工作总结
2014/03/03 职场文书
安全负责人任命书
2014/06/06 职场文书
建设工地安全标语
2014/06/07 职场文书
连锁超市项目计划书
2014/09/15 职场文书
2014年电信员工工作总结
2014/12/19 职场文书
寒山寺导游词
2015/02/03 职场文书
2015年测量员工作总结
2015/05/23 职场文书
上诉状格式
2015/05/23 职场文书
Python中zipfile压缩包模块的使用
2021/05/14 Python
MySQL数据库如何查看表占用空间大小
2022/06/10 MySQL