解决IE6 IE7 IE8 IE9 IE10 IE11支持Bootstrap的解决方法，解决后支持HTML5
本站使用的Bootstarp 3.x ，一直就不支持非 HTML5 的浏览器，也就是不在非HTML5浏览器下，显示是不友好的，之前一直没空解决，看着挺恶心的，今天我把他改版支持 IE 浏览器，故发布了：解决IE6 IE7 IE8 IE9 IE10 IE11支持 Bootstrap 的解决方法。
首先这些资料摘自网络上的各个作者的文章，下面可能会列举参照的网址。
一、引入依赖的Javascript。
http://open.sojson.com/common/html5/html5shiv.jshttp://open.sojson.com/common/html5/respond.min.js这2个Javascript 是在本站开放CDN 上，您可以复制地址直接使用，安全和稳定性不用担心。如果担心的，本博客下附件可以下载，另外要引用 Jquery 。
http://open.sojson.com/common/jquery/jquery1.8.3.min.js本人比较中意这个版本，v1.8.3 的 JQuery 。
二、增加meta头部信息。
我的建议是添加以下2个即可。
<meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" name="viewport" />
<meta http-equiv="X-UA-Compatible" content="IE=edge"/>bootstrap 不支持IE兼容模式，为了让 IE 浏览器运行最新的渲染模式，将添加以上标签在页面中，IE=edge 表示强制使用 IE 最新内核，chrome=1 表示如果安装了针对IE6/7/8 等版本的浏览器插件Google Chrome Frame （可以让用户的浏览器外观依然是IE的菜单和界面，但用户在浏览网页时，实际上使用的是 Chrome 浏览器内核），那么就用 Chrome 内核来渲染。关于此meta 标签的具体说明，可参见StackOverflow上的精彩回答，<meta> 标签高人的英文解释可以参看http://stackoverflow.com/questions/6771258/whats-the-difference-if-meta-http-equiv-x-ua-compatible-content-ie-edge-e
——摘自：http://blog.csdn.net/chenhongwu666/article/details/41513901/
三、本站就是这么解决的。具体添加的代码如下。
<!--[if lte IE 9]>
<meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" name="viewport" />
<meta http-equiv="X-UA-Compatible" content="IE=edge"/>
<script src="${cdn}/js/common/html5/html5shiv.js"></script>
<script src="${cdn}/js/common/html5/respond.min.js"></script>
<script src="${cdn}/js/common/html5/jquery.placeholder.min.js"></script>
<script>
so(function(){
//再次判断是否支持HTML5
var i = document.createElement("input");
i.setAttribute("type", "range");//因为非HTML5浏览器不支持range属性。
if (i.type == "text" && location.href.search('infoHtml5.html') ===-1) {
layer.open({
title: '系统提示',
content: '经系统检测，您的浏览器不支持HTML5。<br>为了更好的服务，建议你更换浏览器。<br>再使用 www.sojson.com 在线工具。',
btn:['继续使用','详细说明'],
yes: function(index, layero){
layer.msg('有的功能不能正常使用哦。');
}
});
$('.layui-layer-btn1').on('click',function(){
location.href="https://www.sojson.com/infoHtml5.html"
});
}
$('input, textarea').placeholder();
});
</script>
<![endif]-->判断小于IE9 才添加这些代码。
四、解决HTML5 placeholder属性问题。
首先引入一个 JQuery 提供的 Javascript 。
http://open.sojson.com/common/html5/jquery.placeholder.min.js你可以直接使用，或者下载附件。
引入后，再加入初始化事件。
$(function(){
//解决IE浏览器placeholder问题
$('input, textarea').placeholder();
});其实上面的代码里有。最好是判断下是 IE浏览器 下才执行。参考第三点的代码部分。
版权所属：SO JSON在线解析
原文地址：https://www.sojson.com/blog/160.html
转载时必须以链接形式注明原始出处及本声明。
如果本文对你有帮助，那么请你赞助我，让我更有激情的写下去，帮助更多的人。
