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

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

以上是小编为您精心准备的的内容,在的博客、问答、公众号、人物、课程等栏目也有的相关内容,欢迎继续使用右上角搜索按钮进行搜索iframe
父页面
iframe示例、iframe 布局示例、javascript脚本示例、javascript示例、javascript代码示例,以便于您获取更多的相关知识。

时间: 2024-09-12 23:18:51

iframe调用父页面函数示例详解_javascript技巧的相关文章

js调用父框架函数与弹窗调用父页面函数的简单方法_javascript技巧

调用父级中的 aaa的函数 子页面中: onclick="window.parent.frames.aaa()" 父页面中: function aaa() { alert('bbbbb'); } frame框架里的页面要改其他同框架下的页面或父框架的页面就用parent window.opener引用的是window.open打开的页面的父页面. window.frames对象可以引用iframe里的页面,也可以引用frameset里的页面. 可以这样 window.frames[0]

javascript父子页面通讯实例详解_javascript技巧

本文实例讲述了javascript父子页面通讯的实现方法.分享给大家供大家参考.具体分析如下: 如果一个domain为 www.abc.com的页面内部包含一个name属性值为childFrame的iframe,并且这个iframe的domain为 static.abc.com.那么可以通过设置父页面的domain为abc.com,子页面的domain也为abc.com,然后实现父子页面通讯(我这里有点混淆父子页面和跨域的概念. 不采用上面的方法也是可以实现父子页面相互访问的. 方法是:在父页面

JavaScript中的ajax功能的概念和示例详解_javascript技巧

AJAX即"Asynchronous Javascript And XML"(异步JavaScript和XML). 个人理解:ajax就是无刷新提交,然后得到返回内容. 对应的不使用ajax时的传统网页如果需要更新内容(或用php做处理时),必须重载整个网页页面. 示例: html代码如下 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>

JavaScript中子对象访问父对象的方式详解_javascript技巧

在传统面向对象的编程语言里,都会提供一种子类访问父类的特殊语法,引文我们在实现子类方法往往需要父类方法的额外辅助.在这种情况下,子类通常会调用父类中的同名方法,最终以便完成工作. javascript虽然没有类似上述的特殊语法,但我们可以造一个啊! function her(){}; her.prototype.name = 'Anna'; her.prototype.toString = function(){ var const = this.constructor; return cons

JavaScript作用域示例详解_javascript技巧

作用域是JavaScript最重要的概念之一,想要学好JavaScript就需要理解JavaScript作用域和作用域链的工作原理.今天这篇文章对JavaScript作用域示例详解的介绍,希望能帮助大家更好的学习JavaScript. 任何程序设计语言都有作用域的概念,简单的说,作用域就是变量与函数的可访问范围,即作用域控制着变量与函数的可见性和生命周期.在JavaScript中,变量的作用域有全局作用域和局部作用域两种. 一.JavaScript中无块级作用域 在Java或C#中存在块级作用域

js匿名函数作为函数参数详解_javascript技巧

由衷的感叹,js真是烦. 学到现在,渐渐理解了什么是:语言都是通用的,没有好不好,只有擅长不擅长. 继承,多态,甚至指针,c能实现,c++,java有,javascript(和java是雷锋和雷峰塔的区别,名字上不知道坑了多少人)也能变通实现. 温故知新,今天又回味了一遍,匿名函数作为函数参数. 代码很短,五脏俱全. <!DOCTYPE html> <html lang="en"> <head> </head> <body>

JavaScript中自带的 reduce()方法使用示例详解_javascript技巧

1.方法说明 , Array的reduce()把一个函数作用在这个Array的[x1, x2, x3...]上,这个函数必须接收两个参数,reduce()把结果继续和序列的下一个元素做累积计算,其效果就是: [x1, x2, x3, x4].reduce(f) = f(f(f(x1, x2), x3), x4) 2. 使用示例 'use strict'; function string2int(s){ if(!s){ alert('the params empty'); return; } if

js 能实现监听F5页面刷新子iframe 而父页面不刷新的方法_javascript技巧

重点是阻止默认的刷新,这样外部页面就不刷新了,然后指定刷新iframe,我下面给出了思路 document.onkeypress = function(e){ if(e.keyCode == 116){ e.preventDefault(); //组织默认刷新 var iframeSrc = iframe.src; iframe.src = iframeSrc; } } iframe页面里再写如下: var iframeSrc = parent.iframe.src; document.onke

JavaScript中eval()函数用法详解_javascript技巧

eval() 函数计算 JavaScript 字符串,并把它作为脚本代码来执行. 如果参数是一个表达式,eval() 函数将执行表达式.如果参数是Javascript语句,eval()将执行 Javascript 语句. 语法 复制代码 代码如下: eval(string) 参数 描述 string 必需.要计算的字符串,其中含有要计算的 JavaScript 表达式或要执行的语句. eval()函数用法详解: 此函数可能使用的频率并不是太高,但是在某些情况下具有很大的作用,下面就介绍一下eva