iframe调用父页面函数示例详解
更新时间:2014年07月17日 17:19:16 投稿:whsnow
这篇文章主要介绍了iframe如何调用父页面函数,下面有个不错的示例,大家可以参考下
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(); })
相关文章
关于IE、Firefox、Opera页面呈现异同 写脚本很痛苦
关于IE、Firefox、Opera页面呈现异同 写脚本很痛苦,对于多浏览器的兼容性,需要注意。2009-08-08JavaScript Window 打开新窗口(window.location.href、windo
本文主要介绍了JavaScript Window 打开新窗口的三种方式,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧2023-05-05
最新评论