目标：后台系统，点击侧栏菜单后，右边div的要显示对应的内容。就是说，每选一下左边的菜单，右边的内容都要变化。

方法：使用iframe框架。

第一步：在需要展示的div中写iframe：

<iframe src=“要插入的html文件.html” name="iframe（任意取名）" width=420 height=330 frameborder=0 scrolling=auto>如果浏览器不支持iframe框架，会向用户显示这里的文字</iframe>

第二步：在相应的li中写：

<li><a href="要显示的html文件.html" target="iframe的name">项目管理</a><iframe>

最后成型的代码：

另外一个更加清晰简单的实现：

<html>

<body>

<a href= "1.html " target= "iFrame1 "> page1 </a> <br/>

<a href= "2.html " target= "iFrame1 "> page2 </a> <br/>

<a href= "3.html " target= "iFrame1 "> page3 </a> <br/>

<a href= "4.html " target= "iFrame1 "> page4 </a> <br/>

<div id= "iFrame1 " style= "position:absolute; left:220px; top:200px; z-index:18 ">

<iframe name= "iFrame1 " width=542 height=615 src= "1.html " scrolling= "auto " frameborder= "0 "> </iframe>

</div>

</div> </body>

</html>

iframe框架的应用的更多相关文章

  1. ASP.NET 页面禁止被 iframe 框架引用

    两个站点: a.sample.com b.sample.com a.sample.com 站点中的一段示例 JS 代码: var iframe = document.createElement(&qu ...

  2. 当session过期后自动跳转到登陆页而且会跳出iframe框架

    写项目时在重定向后一直存在一个问题就是重定向后登陆页面会出现在跳出的子框架里.

  3. session失效后，登录页面嵌入iframe框架

    在登录页面的onload方法中加入以下代码解决: //防止登录页面嵌入iframe框架 if (top.location != self.location){ top.location=self.lo ...

  4. javascript获取iframe框架中页面document对象,获取子页面里面的内容,iframe获取父页面的元素,

    javascript获取iframe框架中,加载的页面document对象 因为浏览器安全限制,对跨域访问的页面,其document对象无法读取.设置属性 function getDocument(i ...

  5. js实现网页防止被iframe框架嵌套及几种location.href的区别

    首先我们了解一下几种location.href的区别简单的说:几种location.href的区别js实现网页被iframe框架功能,感兴趣的朋友可以了解下 首先我们了解一下:window.locat ...

  6. javascript_获取iframe框架中元素节点的属性值

    1. DOM:文档对象模型 [window 对象] 它是一个顶层对象,而不是另一个对象的属性即浏览器的窗口. [document 对象] 该对象是window和frames对象的一个属性,是显示于窗口 ...

  7. iframe框架自适应高度 uncanght SecurityError: Blocked a frame with origin "null" from accessing a frame ....

    来源于crm项目的contact/edit.html 一.背景是这样的 最近在做crm系统的前端页面,有一个页面呢,点击“查看全部信息”时会弹出,这个弹窗里面又有分页导航,分页不是使用ajax 异步刷 ...

  8. 在Iframe框架下如何跳转到登录界面

    在Iframe框架下跳转到登录界面总会跳到子界面中,类似于下图 试用Respon.Redirect()不行, 用Js函数,但我跳转代码都是写在cs文件中的,用Respose.write(),js函数根 ...

  9. Javscript调用iframe框架页面中函数的方法

    Javscript调用iframe框架页面中函数的方法,可以实现iframe之间传值或修改值了, 访问iframe里面的函数: window.frames['CallCenter_iframe'].h ...

随机推荐

  1. 初学canvas，遇到width和height显示问题和用excanvas.js兼容IE问题

    /*-----------------------ITEYE 祈祷幸福博客原创,转载请注明.-------------------*/ 第一次认真写技术博客文~~~若有不严谨的地方,望指正. 今天是第 ...

  2. WEB开发性能优化--核心定义介绍篇（1）

    推荐理由 随着 互联网的蓬勃发展,并且伴随着产品功能的越来越复杂,对于技术人员来说最大的挑战就是如何在保证业务快速发展的同时,也可保证不断复杂的业务对用户体验的影响,其中对用户来说最重要的体验指标是如 ...

  3. 实践 config drive - 每天5分钟玩转 OpenStack（170）

    如果 instance 无法通过 metadata service 获取 metadata(无 DHCP 或者 nova-api-metadata 服务),instance 还可以通过 config ...

  4. Spring+SpringMVC+MyBatis+easyUI整合优化篇（四）单元测试实例

    日常啰嗦 前一篇文章<Spring+SpringMVC+MyBatis+easyUI整合优化篇(三)代码测试>讲了不为和不能两个状态,针对不为,只能自己调整心态了,而对于不能,本文会结合一 ...

  5. iOS 按钮连续提交执行一次（如留言提交，多次拍照问题）

    在很多项目中暴力测试时会出现多次点击执行一个方法  可以用下面的语句进行解决 //先将未到时间执行前的任务取消. [[self class] cancelPreviousPerformRequests ...

  6. 老李分享：HTTP协议之协议头

    老李分享:HTTP协议之协议头   当我们打开一个网页时,浏览器要向网站服务器发送一个HTTP请求头,然后网站服务器根据HTTP请求头的内容生成当次请求的内容发送给浏览器.你明白HTTP请求头的具体含 ...

  7. SystemClock官方简介

    public final class SystemClock extends Object java.lang.Object    ↳ android.os.SystemClock Class Ove ...

  8. linux从入门到精通学习-NFS

    NFS网络文件系统 功能 nfs[network file system] 网络文件系统 是FreBSD系统支持的一种系统,允许在网络 上与其它人共享使用文件或文件夹 采用C/S模式 端口号 在vim ...

  9. juery悬浮框

    现在的淘宝啊,京东啊等很多平台都用到了一个技术,就是当页面下拉时,某个div会一直悬浮在页面顶端.具体代码如下<p>jQuery实现页面滚动时层智能浮动定位</p><!D ...

  10. OnsenUI 前端框架（三）

    上一章咱们学习了OnsenUI的工具栏.侧边栏和标签栏.通过对页面上这三部分的学习,咱们对混合应用的一个页面有了大体上的认识.从这一章开始,咱们学习OnsenUI混合项目开发过程中会用到的各种各样的组 ...