目标：后台系统，点击侧栏菜单后，右边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. parentNode和parentElement区别

    parentNode跟parentElement除了前者是w3c标准,后者只ie支持 当父节点的nodeType不是1,即不是element节点的话,它的parentElement就会是null 一般 ...

  2. JavaScript高级程序设计---学习笔记（一）

    今天,2017.3.17开始利用课余时间仔细学习<JavaScript高级程序设计>,将需要掌握的知识点记录下来,争取把书里的所有代码敲一遍并掌握. 1.标识符命名最好是第一个字母小写,剩 ...

  3. 面向对象的三大特征——封装、继承、多态（&常用关键字）

    一.封装 Encapsulation 在面向对象程式设计方法中,封装是指,一种将抽象性函式接口的实作细节部份包装.隐藏起来的方法. 封装的概念(针对服务器开发,保护内部,确保服务器不出现问题) 将类的 ...

  4. 手机自动化测试：appium源码分析之bootstrap十二

    手机自动化测试:appium源码分析之bootstrap十二   poptest是国内唯一一家培养测试开发工程师的培训机构,以学员能胜任自动化测试,性能测试,测试工具开发等工作为目标.如果对课程感兴趣 ...

  5. 老李分享：天使投资 vs. 风险投资 vs. 私募股权融资

    天使投资(Angel Capital) 创意阶段(idea stage)到种子阶段(seed stage) 0 – 1百万美元营业额 还没有盈利 小股东 风险异常的高 不存在负债情况 风险投资(Ven ...

  6. Hibernate基础学习(五)—对象-关系映射(下)

    一.单向n-1 单向n-1关联只需从n的一端可以访问1的一端. 域模型: 从Order到Customer的多对一单向关联.Order类中定义一个Customer属性,而在Customer类不用存放Or ...

  7. 安卓 ADB常见问题整理

    以下都是ADB连接问题,可以通过尝试如下步骤,由简单度排序 1. 插拔下USB连接线 2. 关闭USB模式再打开 3. 执行以下命令 adb kill-server adb start-server ...

  8. 搭建MySQL高可用负载均衡集群

    1.简介 使用MySQL时随着时间的增长,用户量以及数据量的逐渐增加,访问量更是剧增,最终将会使MySQL达到某个瓶颈,那么MySQL的性能将会大大降低.这一结果也不利于软件的推广. 那么如何跨过这个 ...

  9. iOS实现高斯模糊效果(Swift版本)

    给UIimage添加分类 extension UIImage { /// 高斯模糊 func gaussianBlur(var blurAmount:CGFloat) -> UIImage { ...

  10. CGLIB和JDK代理

    需要的架包:在spring中提供对CGLIB的支持 一.JDK的动态代理 1.接口IUserDao package cn.itcast.spring3.jdk.proxy; public interf ...