HTML5不支持frameset的两种解决方法


Posted in HTML / CSS onNovember 14, 2016

解决方法如下:

第一种

使用iframe,但是目前使用iframe的人已经越来越少了,而且iframe在不同浏览器之间还有不兼容的情况。而且我一些研发的人员,他们表示iframe窗口间传值似乎很麻烦。

第二种

使用jQuery的onload方法加载页面,不过这种方法跳转多个页面后,点击浏览器上方的后退前进是无效的,不过可以认为的添加一个返回按钮。

所以个人更倾向于这种方法。

我一般是这样写的

$("#main").load("mainIndex.html",function(){

 });

对于页面,div+css可以实现frame的效果

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>div+css实现frameset效果</title>
<style type="text/css">
.header{border-bottom:1px solid #ccc;margin-bottom:5px;}
.MainContainer{min-width:960px;max-width:1600px;}
.sidebar{width:180px;float:left;margin-right:-180px;border-right:1px solid #ccc;min-height:500px;padding:5px;}
.main{float:left;margin-left:200px;padding:5px;}
.content{padding:0 10px;}
</style>
</head>
<body>
    <div class="page">
        <div class="header">
            <div id="title">
                <h1>顶部</h1>
            </div>
        </div>
        <div class="MainContainer">
            <div class="sidebar">
            边栏
            </div>
            <div  id="main" class="main">
                内容
            </div>           
        </div>
    </div>
</body>
</html>

总结

以上就是这篇文章的全部内容了,希望本文的内容对大家的学习或者工作能带来一定的帮助,如果有疑问大家可以留言交流。

HTML / CSS 相关文章推荐
利用CSS3实现动态的二级三级菜单效果实例源码
Jan 04 HTML / CSS
CSS3实现王者荣耀匹配人员加载页面的方法
Apr 16 HTML / CSS
W3C公布最新的HTML5标准草案
Oct 17 HTML / CSS
html5教程调用绘图api画简单的圆形代码分享
Dec 04 HTML / CSS
html5中valid、invalid、required的定义
Feb 21 HTML / CSS
一些常用的HTML5模式(pattern) 总结
Jul 14 HTML / CSS
使用HTML5和CSS3制作一个模态框的示例
Mar 07 HTML / CSS
Canvas中设置width与height的问题浅析
Nov 01 HTML / CSS
手把手教你实现一个canvas智绘画板的方法
Mar 04 HTML / CSS
详解HTML5布局和HTML5标签
Oct 26 HTML / CSS
HTML页面滚动时部分内容位置固定不滚动的实现
Apr 14 HTML / CSS
使用CSS实现按钮边缘跑马灯动画
May 07 HTML / CSS
html5 视频播放解决方案
Nov 06 #HTML / CSS
HTML5头部标签的一些常用信息小结
Oct 23 #HTML / CSS
解决canvas转base64/jpeg时透明区域变成黑色背景的方法
Oct 23 #HTML / CSS
HTML5页面音视频在微信和app下自动播放的实现方法
Oct 20 #HTML / CSS
浅谈html5标签css3的常用样式
Oct 20 #HTML / CSS
html5中的一些标签学习(心得)
Oct 18 #HTML / CSS
HTML5+CSS3实现机器猫
Oct 17 #HTML / CSS
You might like
PHP与SQL注入攻击[三]
2007/04/17 PHP
用PHP查询搜索引擎排名位置的代码
2010/01/05 PHP
PHP初学者最感迷茫的问题小结
2010/03/27 PHP
PHP中的正则表达式函数介绍
2012/02/27 PHP
windows下配置apache+php+mysql时出现问题的处理方法
2014/06/20 PHP
php自定义错误处理用法实例
2015/03/20 PHP
php实现格式化多行文本为Js可用格式
2015/04/15 PHP
Linux下快速搭建php开发环境
2017/03/13 PHP
thinkPHP5框架实现基于ajax的分页功能示例
2018/06/12 PHP
thinkphp5 + ajax 使用formdata提交数据(包括文件上传) 后台返回json完整实例
2020/03/02 PHP
使用jQuery.wechat构建微信WEB应用
2014/10/09 Javascript
Uploadify上传文件方法
2016/03/16 Javascript
Json解析的方法小结
2016/06/22 Javascript
AngularJS基础 ng-paste 指令简单示例
2016/08/02 Javascript
javascript self对象使用详解
2016/10/18 Javascript
JS实现密码框的显示密码和隐藏密码功能示例
2016/12/26 Javascript
vue.js 底部导航栏 一级路由显示 子路由不显示的解决方法
2018/03/09 Javascript
详解从react转职到vue开发的项目准备
2019/01/14 Javascript
NodeJS 文件夹拷贝以及删除功能
2019/09/03 NodeJs
基于vue+echarts 数据可视化大屏展示的方法示例
2020/03/09 Javascript
[01:10]DOTA2 Supermajor:英雄,由我们见证
2018/05/14 DOTA
Python字符串格式化输出方法分析
2016/04/13 Python
Python中字符串格式化str.format的详细介绍
2017/02/17 Python
在python中使用正则表达式查找可嵌套字符串组
2017/10/24 Python
python实现百度OCR图片识别过程解析
2020/01/17 Python
Python换行与不换行的输出实例
2020/02/19 Python
Python如何使用paramiko模块连接linux
2020/03/18 Python
python 利用百度API识别图片文字(多线程版)
2020/12/14 Python
理肤泉美国官网:La Roche-Posay
2018/01/17 全球购物
印度和世界各地的精美产品:Ikka Dukka
2018/02/12 全球购物
什么是Web Service?
2012/07/25 面试题
化学相关工作求职信
2013/10/02 职场文书
学习之星事迹材料
2014/05/17 职场文书
会计学专业求职信
2014/07/17 职场文书
董事长岗位职责
2015/02/13 职场文书
校园广播稿范文
2015/08/19 职场文书