iframe调用父页面函数用法举例

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> www.jbxue.com

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){ www.jbxue.com

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(); 

})

你可能感兴趣的:(iframe)