`

用iframe来实现一个页面嵌套另一个页面

阅读更多

用iframe来实现一个页面嵌套另一个页面,以此来实现页面局部动态刷新,就像AJAX做的效果。

用struts2.0做的:

  

<iframe id="pic" name="pic" width="100%" scrolling="no"  onload="this.height=pic.document.body.scrollHeight" frameborder="0" 
                 src="Page.action?returnPage=viewpicture&classId=<s:property value="#request.scene.id"/>&currPage=<s:property value="#request.currPage"/>">
</iframe>

 这样就可以了。

 

但是上面的iframe在firefox下面却不能显示出来,还有Apple Safari浏览器里面都无法显示出来。

这时候要加JS代码了

<script>
	var ie=!!document.all;
	function LoadIf(){
	  var doc;
	  if(ie){
		  doc = frames['pic'].document;
	  }else{ 
		  doc = document.getElementById("pic").contentWindow.document;
	  }
	  document.getElementById("thumbnailwrapper").innerHTML = doc.body.innerHTML;
	}
</script>

 

这样就可以搞定了。

分享到:
评论

相关推荐

    在vue中实现嵌套页面(iframe)

    在Vue.js中实现嵌套页面通常涉及到使用`iframe`元素来加载外部网页或者内部组件。`iframe`允许我们在一个Vue应用中嵌入另一个独立的HTML文档,这对于展示第三方内容、实现某些特定功能或者处理复杂交互场景时非常...

    iframe实现左侧菜单右侧页面简单示例

    总的来说,"iframe实现左侧菜单右侧页面简单示例"是一个很好的教学资源,它涵盖了网页布局、iframe嵌套、CSS样式设计等基础知识,对于初学者来说,可以通过这个实例学习并掌握这些技能,为构建更复杂的Web应用打下...

    拖拽一个iframe中的div 在另一个iframe页面中显示

    标题 "拖拽一个iframe中的div 在另一个iframe页面中显示" 描述了在Web开发中一个交互性的技术,涉及跨框架(iframe)通信和DOM操作。这个技术主要应用于创建富交互的用户界面,允许用户在不同的iframe之间传递和操作...

    div嵌套html不用iframe

    最近在做作业中需要在不用iframe的情况下嵌套页面,所以只好在div中嵌套,用的是jquery方法。 复制代码代码如下: [removed] $(document).ready(function() { $(“#button”).click(function() { $(“#content”)....

    HTML阻止iframe跳转页面并使用iframe在页面内嵌微信网页版的实现方法

    就想弄一个winform结合html5的一个小东西,突有心血来潮,想在里面嵌套一个微信网页版,下面小编给大家介绍下HTML阻止iframe跳转页面并使用iframe在页面内嵌微信网页版的实现方法,一起看看吧

    iframe跨域嵌套自适应高度

    在网页开发过程中,`iframe`作为一种常见的网页元素,被广泛用于在当前页面中嵌入另一个独立的文档或页面。然而,在实际应用中经常会遇到一些问题,如跨域限制、自适应高度调整以及安全方面的考虑等。本文将详细介绍...

    iframe嵌套web纯前端页面,运用Bootstrap(v5.1)技术

    iframe实现左侧菜单右侧页面简单示例。点击左侧菜单,右侧显示不同html内容,并加有css样式,美观实用。很简单的界面,没有多余功能。博文网址:https://blog.csdn.net/LawrenceUyi31?type=blog

    iframe弹出框遮罩父类页面

    总的来说,"iframe弹出框遮罩父类页面"是一个常见的前端交互需求,通过合理使用`iframe`、JavaScript和CSS,以及像EasyUI这样的库,可以实现高效、简洁的解决方案。理解并掌握这些知识点对于提升网页交互体验至关...

    实现iframe嵌套,适合CMS,CRM等后台框架

    在IT行业中,iframe(内联框架)是一种常用于网页开发的技术,它允许在一个HTML文档中嵌入另一个HTML文档。在CMS(内容管理系统)和CRM(客户关系管理)等后台框架中,iframe的应用尤为广泛,因为它提供了多页面内容...

    多层嵌套iframe 自适应高度的解决方法

    多层嵌套iframe 自适应高度的解决方法

    jQuery冻结表头-嵌套iframe页面

    总的来说,"jQuery冻结表头-嵌套iframe页面"是一个涉及到JavaScript编程、CSS布局、事件处理和跨域通信的综合问题。理解和掌握这些知识点对于提升网页开发技能,特别是处理复杂UI交互的能力,是非常有价值的。

    嵌套iFrame使用postMessage相互传递消息(嵌套iFrame、跨父子窗口、跨页面).zip

    练习说明:使用postMessage可以在iFrame、父子窗口、跨页面等,之间相互传递消息。 你好,我是TKCB-GO,一个有着游戏策划梦想,却沦为程序员的游戏家,这是我的技术博客:www.tkcb.cc 技术博客网站里面,除了我的...

    iframe自动适应高度(完美自适应高度嵌套代码),兼容目前主流浏览器。

    在网页开发中,`iframe`(Inline Frame)是一种非常有用的元素,它允许我们在一个页面中嵌入另一个页面的内容。然而,`iframe`的高度自动适应往往成为开发者面临的问题,特别是当嵌入的内容高度不确定时。标题提到的...

    iframe中页面显示不全1

    在网页设计中,`&lt;iframe&gt;`元素是一种非常实用的工具,它允许我们在一个网页中嵌入另一个网页,比如展示文档、视频或者地图等。当遇到"Iframe中页面显示不全"的问题时,通常是由于iframe的尺寸设置不当或者与被嵌入...

    使用iframe在网页中嵌入其他网页的方法

    总结来说,`iframe`是一个强大的网页设计元素,它可以方便地将其他网页内容嵌入到当前页面中,通过调整其属性,可以实现定制化的展示效果。然而,在使用`iframe`时,也需要考虑到潜在的技术限制和用户体验因素。对于...

    嵌套页面实例.txt 嵌套页面实例

    给定的文件片段中使用的是`&lt;iframe&gt;`标签,这是一个典型的嵌套页面实现方式。代码如下: ```html &lt;iframe src='http://www.qbase.cn:8080/bbs/index.jsp' width='445' height='84'&gt;&lt;/iframe&gt; ``` 这里,`...

    vue 页面tabs切换,替换iframe

    标题提到的“vue 页面tabs切换,替换iframe”,就是指用Vue的特性和组件来实现更加现代和灵活的Tab切换功能,避免使用iframe。下面将详细介绍如何使用`vue-router`的`router-view`和`keep-alive`来实现这一目标。 ...

    vue3嵌套iframe及相互通迅

    实现通过vue路由 加载第三方服务页面,实时同步vue路由及iframe页面地址,可用于JSF等项目重构,也可用于直接访问静态页面。具体实现文档地址为:...

    iframe 跨域解决方法

    在Web开发中,`iframe` 是一个非常常用的元素,它允许我们在一个页面中嵌入另一个网页。然而,由于浏览器的同源策略限制,当`iframe`加载的页面与包含它的页面不在同一个域名下时,就会遇到跨域问题。这篇博客将深入...

Global site tag (gtag.js) - Google Analytics