用js互相调用iframe页面内的js函数

最近,天天搞论文开题报告,一时技痒,再次设计Web,一下子就碰到一个问题,以前设计WEB页的时候都是在IE里 面跑的,从来没有考虑过firefox 更别提chrome了,可是现在不同了,至少我认为不兼容Firefox的WEB页面是极其丑陋和山寨的,所以从有个这个观念开始,我设计页面就开始注意 这个兼容性,而这次就碰到一个兼容性的问题,html里面有一个浮动框架,<iframe >,可以在页面中内嵌入一个页面,用来做框架页面非常适合,如下图,
 
一个html页面,分成左右两块,左边为导航栏,右边为需要显示的内容,代码如下:
左栏的代码为:
<IFRAME frameBorder=0 id=frmTitleLeft name=framLeft src="left.html" style="HEIGHT: 100%; width:180px;">
连接到left.html
右栏也类似,就本人所做的页面,预览的效果如下:
 
现在要达到什么样的效果才能起到比较实用的效果呢,点击其中的任何链接,都可以在右栏显示,那么很显然需要通过js来实现,原始的不兼容的办法我也不多说了,请大家记住以下实现步骤:
1,首先获得右栏iframe对象
var frames=document.getElementById("frameid");//frameid即右栏iframe的id名
2,重置其src值
frames.src=pageurl;//pageurl即要显示的目的页面
这样就实现了页面的跳转

但是还有一点,如果想调用其中的函数就不是这么简单了
比如右栏中有一个函数right(),我要在左栏的链接中调用right()函数,该如何实现呢

1,首先leftframe是内嵌在容器页index.html中的,因此需要先返回到index这一级别,并取得rightframe对象
var frames=window.parent.window.document.getElementById("frameid");

2,要能执行其页面中的函数,必须要获得window对象,这里有一个重要的对象contentWindow,获得这个对象,即可执行其中的函数了,如
frames.contentWindow.right();

以上代码兼容IE6,Firefox3,chrome2.0,均成功通过测试,IE7没试过,不过应该没问题。

时间: 2024-08-03 05:06:42

用js互相调用iframe页面内的js函数的相关文章

.cs文件中能否调用html页面内写的js函数

问题描述 第一,能否将cs文件中函数的返回值传入到html页面中或者是在cs函数中能否调用html页面内的js函数,如果可以的话如何实现.求大神指点. 解决方案 解决方案二:html是由asp生成的,没有传递的说法解决方案三:那能不能直接去调用那里的js函数呢??解决方案四:理论上是可以用ScriptManager调用,但这样做一般都没有必要,搞明白了动态网站工作原理和js本质后,回头再看这些需求,你会发现,处理方法很多,都比后台调用页面js好解决方案五:当一个页面在浏览器上展示的时候,web服

jQuery基于ID调用指定iframe页面内的方法_jquery

本文实例讲述了jQuery基于ID调用指定iframe页面内的方法.分享给大家供大家参考,具体如下: 复制代码 代码如下: $(window.parent.document).contents().find("#iframeID")[0].contentWindow.initPagerList(); 说明: iframeID 为iframe的ID: initPagerList 为 iframe 页面内的方法. <html> <head> <title>

bho-请问JS怎么调用BHO中的带参函数?

问题描述 请问JS怎么调用BHO中的带参函数? 请问JS怎么调用BHO中的带参函数?麻烦给出代码实现,多谢!

禁止iframe页面的所有js脚本如alert及弹出窗口等_javascript技巧

今天做一个小软件遇到一个问题,就是在一个页面里面需要放一个iframe框架来预览网站,可是被预览的这个网站中含有很多js脚本,如弹出窗口,提示框,最可恶的是一直让设为首页和加入收藏,我想应该有办法禁止iframe里面的脚本吧,于是百度了一下,还发现不少新大陆,于是解决了这个问题,记录下来,方便以后查询,也方便大家参考: <iframe src="fillseo.html"></iframe> fillseo.html里面有个js脚本,其中有alert,还有弹出窗

JSF2.0中,怎样在托管Bean中调用xhtml页面中的js脚本

问题描述 具体情况:在xhtml页面中,弹出一个dialog:这个dialog是一个添加功能,当把所有的值填写完毕后,点击"提交","提交"执行的方法是在托管Bean中实现的,"提交"执行完毕后需要关闭这个dialog,关闭方法时一个js,在xhtml中请问在后台的jsf托管Bean中如何调用前台的js脚本呢,就是关闭这个dialog.谢谢啊! 解决方案 解决方案二:你弄混淆了,后台服务器上执行时与浏览器没有直接关系,不可能直接调用js的(js是

Node.js中调用mysql存储过程示例_node.js

例子仅在windows下测试通过,没有放在linux下测试.如有问题,可以电邮给我~ 1.安装node.js.mysql,此处略(自行搜索吧)-: 2.创建一个名为test的数据库,然后建一张名为user_info的表(仅供测试)- 这里假定mysql使用的用户名为root,密码为123456 相应的mysql如下: 复制代码 代码如下: /** * 创建名为test的数据库 */ DROP DATABASE IF EXISTS test; CREATE DATABASE test; USE t

iframe里面的页面调用父窗口,左右窗口js函数的方法

iframe里面的页面调用父窗口,左右窗口js函数的方法 实现iframe内部页面直接调用该iframe所属父窗口自定义函数的方法. 比如有A窗口,A内有个IFRAME B,B里面的装载的是C页面,这时C要直接调用A里面的一个自定义函数AFUN(); 那么只要在C页面中写如下JS函数就可以了: window.parent.AFUN(); 如果AFUN()有参数也可以直接传递合适的参数进去. 例如: 修改父窗口控件属性 window.parent.document.getElementById('

js 或 jquery 有没有在一个页面上调用某个页面的方法

问题描述 js 或 jquery 有没有在一个页面上调用某个页面的方法 js 或 jquery 有没有在一个页面上调用某个页面的方法 解决方案 什么叫调用页面?是调用服务器还是跳转? 前者用 $ajax,直接get /post 你的服务器地址 后者,window.location = 你的地址 解决方案二: 框架页面中js方法之间调用jquery加载页面时调用js的方法IFrame下子页面调用父框架的JS方法 解决方案三: 如果原页面不动的话,就用ajax,异步调用:如果需要跳转到目标页面的,就

Asp c# 如何在子页面中调用父页面中的方法或执行父页面中某个按键(Button)中的代码

问题描述 各位高手,有个问题求助,我搞了一天,也从网上查询了许久,找不到办法,请帮帮我.事由:我使用vs2010c#,ie8建网站,现有父页面A和子页面B.A页面(父页面):在A页面(A.aspx)有一个GridView网格Gridview_A,Gridview_A通过A页面上的按键Button_A_Click将表Table_A(Table_A放在Session["Table_A"]中)绑定,A页面(A.aspx)还有一个调用子页面B(B.aspx)的按键Button_AcallB_C