iframe框架页面如下:

<!DOCTYPE html>
<html lang="zh">
<head>
<meta name='viewport' content='initial-scale = 1, minimum-scale = 1, maximum-scale = 1'/>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="x-ua-compatible" content="IE=10">
<title></title>

</head>
<body onload="abc();">
<iframe width="20%" height="500px" src="${pageContext.request.contextPath}/cw/mainTree.do" name="mainTree" frameborder="0" scrolling="yes" style="float: left;"></iframe>
<iframe width="80%" height="500px" src="${uploadPath }" name="contentIFrame" id="contentIFrame" frameborder="0" scrolling="yes" style="float: right;"></iframe>

</body>
<script>
function abc(){
timer = setInterval('addListener()',1000)
}
function addListener(){
    cpWindow = window.frames["contentIFrame"];
    if(cpWindow.cpAPIEventEmitter){
        cpWindow.cpAPIEventEmitter.addEventListener("CPAPI_MOVIEPAUSE",function(a,b,c,d){
                            alert(7);
                            });
        clearInterval(timer);
    }
}
</script>
</html>

触发事件,脱离iframei显示的页面

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>

<meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
    <title>jQuery treeview</title>
    
    <link rel="stylesheet" href="/courseware-tool/resources/css/jquery.treeview.css" />
    <!-- <link rel="stylesheet" href="../red-treeview.css" /> -->
    <link rel="stylesheet" href="/courseware-tool/resources/css/screen.css" />
    <script src="/courseware-tool/resources/js/jquery.js" type="text/javascript"></script>
    <script src="/courseware-tool/resources/js/jquery.cookie.js" type="text/javascript"></script>
    <script src="/courseware-tool/resources/js/jquery.treeview.js" type="text/javascript"></script>
    
    <script type="text/javascript">
    $(document).ready(function(){
        $("#browser").treeview({
            toggle: function() {
                console.log("%s was toggled.", $(this).find(">span").text());
            }
        });
    });
    function playCw(obj){
        window.parent.location.href="${pageContext.request.contextPath}/cw/playCw.do?cwId="+obj;
    }
    </script>
    </head>
    <body>
    
    <h1 id="banner"><a href="javascript:void(0)">课程播放</a></h1>
    <div id="main">
    <ul id="browser" class="filetree treeview-famfamfam">
        <li><span class="folder">课程名称</span>
            <ul>
            <c:if test="${not empty list }">
                <c:forEach items="${list }" var="list">
                    <li><span class="folder" onclick="playCw('${list.cwId}')">${list.cwName }</span>
                        <ul>
                            <c:if test="${not empty list.cwInfo }">
                                <c:forEach items="${list.cwInfo }" var="list">
                                    <li><span class="file" onclick="playCw('${list.cwId}')">${list.cwName }</span></li>
                                    <c:if test="${not empty list.cwInfo }">
                                        <c:import url="mainTreeContent.jsp" />
                                    </c:if>
                                </c:forEach>
                            </c:if>
                        </ul>
                    </li>
                </c:forEach>
            </c:if>
            </ul>
        </li>
    </ul>
</div>
</body>
</html>

重点解析:

window.parent.location.href="${pageContext.request.contextPath}/cw/playCw.do?cwId="+obj;

当前iframe的父框架显示内容

window.parent.contentIFrame.location.href="${pageContext.request.contextPath}/cw/playCw.do?cwId="+obj";

window.parent取父框架显示

window.parent.contentIFrame取子框架显示

href脱离iframe显示的更多相关文章

  1. iframe显示错误页面

    当系统出现异常时,ifrme中显示的内容为错也页面,而不是罪顶层的框架显示错误内容,此时的解决办法是在错误页面或相关的登录页面中加入 错误页面加载的JS如下 <script type=" ...

  2. 关于extjs中动态添加TabPanel的tab项并以iframe显示的整理

    近来的项目中用到了Extjs 的TabPanel,这也是Extjs最基本,最常用的组件了 网上或者书上的例子里大都是把tab项渲染到一个div中, 这对于在每个Tab页里加载一个页面的情况就不适合了 ...

  3. CSS<img>与<a href>字体同行显示方法与对齐

    1.一开始使用php的volist标签conding了这样一段代码: <volist name="result['list']" id="temp"> ...

  4. iframe显示滚动条

    子页面通过iframe加载,出现了竖向滚动条 最后查出原因:文档申明 iframe有滚动条的页面的文档申明 <!DOCTYPE html> 改成如下就行了 <!DOCTYPE HTM ...

  5. iframe显示滚动栏

    子页面通过iframe载入.出现了竖向滚动栏 最后查出原因:文档申明 iframe有滚动栏的页面的文档申明 <!DOCTYPE html> 改成例如以下即可了 <!DOCTYPE H ...

  6. CRM IFRAME 显示地图

    作者:卞功鑫  ,转载请保留.http://www.cnblogs.com/BinBinGo/p/5274409.html 需要背景: 现在已经有经纬度,需要在地图上显示出来. 环境: CRM 4.0 ...

  7. iframe显示跨域url页面

    可以通过JS搞定跨域问题,但是比较麻烦,我就在后台处理了,其实这样本质上也算不上是跨域了 后台otherwebsite.php: <?php $url="www.otherwebsit ...

  8. 什么是iframe及作用是什么?

    一. iframe是什么及作用 iframe是嵌入式框架, 是html标签, 还是一个内联元素, iframe 元素会创建包含另外一个文档的内联框架(即行内框架) . 说白了, iframe用来在页面 ...

  9. EasyUI两种动态添加tab Iframe页面的方法

    /** 动态添加tab-----方式一 **/ function addIframeTab(titleTxt,href,icon) { $('#mytabs').tabs('addIframeTab' ...

随机推荐

  1. 关于OOM那些事儿

    最近在aliyun上crontab里放的一个java脚本把机器搞翻了,ssh连不上T_T 发现OOM了,真是无语.并不懂Java的内存模型,转一篇备用吧. 转载自:http://www.cnblogs ...

  2. spring获取ApplicationContext对象的方法——ApplicationContextAware

    一. 引言 工作之余,在看一下当年学的spring时,感觉我们以前都是通过get~ set~方法去取spring的Ioc取bean,今天就想能不能换种模型呢?因为我们在整合s2sh时,也许有那么一天就 ...

  3. web.xml中/与/*的区别

    1.拦截"/",可以实现现在很流行的REST风格.很多互联网类型的应用很喜欢这种风格的URL.为了实现REST风格,拦截了所有的请求.同时对*.js,*.jpg等静态文件的访问也就 ...

  4. 【poj2079】 Triangle

    http://poj.org/problem?id=2079 (题目链接) 题意 求凸包内最大三角形面积 Solution 旋转卡壳. 只会n²的做法,但是竟然过了.就是枚举每一个点,然后旋转卡壳另外 ...

  5. POJ2437 Muddy roads

    Description Farmer John has a problem: the dirt road from his farm to town has suffered in the recen ...

  6. JavaScript------入门

    index.jsp <%@ page language="java" import="java.util.*" pageEncoding="gb ...

  7. goquery

    使用goquery 会用jquery的,goquery基本可以1分钟上手,下面是goquery文档 http://godoc.org/github.com/PuerkitoBio/goquery 1. ...

  8. windows2003安全加固

    因为IIS的方便性和易用性,使它成为最受欢迎的Web服务器软件之一.但是,IIS的安全性却一直令人担忧.如何利用IIS建立一个安全的Web服务器,是很多人关心的话题.要创建一个安全可靠的Web服务器, ...

  9. 修改shell 将当前shell(默认是bash B SHELL )改为csh C SHELL

     在修改当前shell时,用命令: usermod -s  /bin/csh   home     home 为 你所想要改变的用户地址     此处home 为家目录,一般自己创建的用户都会在家目录 ...

  10. .Net开源工作流Roadflow的使用与集成(转)

    序言 最近公司要整理公司内部oa系统,需要使用到工作流,所以就开始了开源工作流挑选,使用,到集成到公司内部系统的工作. 首先在网上搜了文档,自己也有补充,整理啦国内几款工作流的比较,由于没有个个击破式 ...