判断浏览器类型
/**
* 检验浏览器类型
*/
function checkBrowser() {
var Sys = {};
var ua = navigator.userAgent.toLowerCase();
var s;
(s = ua.match(/rv:([\d.]+)\) like gecko/)) ? Sys.ie = s[1]:
(s = ua.match(/msie ([\d.]+)/)) ? Sys.ie = s[1] :
(s = ua.match(/firefox\/([\d.]+)/)) ? Sys.firefox = s[1] :
(s = ua.match(/chrome\/([\d.]+)/)) ? Sys.chrome = s[1] :
(s = ua.match(/opera.([\d.]+)/)) ? Sys.opera = s[1] :
(s = ua.match(/version\/([\d.]+).*safari/)) ? Sys.safari = s[1] : 0;
if(Sys.ie) return "ie";
if(Sys.firefox) return "firefox";
if(Sys.chrome) return "chrome";
if(Sys.opera) return "opera";
if(Sys.safari) return "safari";
}
检测IE浏览器版本信息
/**
* 获取IE的版本
*/
function IEVersion() {
//取得浏览器的userAgent字符串
var userAgent = navigator.userAgent;
//判断是否IE<11浏览器
var isIE = userAgent.indexOf("compatible") > -1 && userAgent.indexOf("MSIE") > -1;
//判断是否IE的Edge浏览器
var isEdge = userAgent.indexOf("Edge") > -1 && !isIE;
var isIE11 = userAgent.indexOf('Trident') > -1 && userAgent.indexOf("rv:11.0") > -1;
if(isIE) {
var reIE = new RegExp("MSIE (\\d+\\.\\d+);");
reIE.test(userAgent);
var fIEVersion = parseFloat(RegExp["$1"]);
if(fIEVersion == 7) {
return 7;
} else if(fIEVersion == 8) {
return 8;
} else if(fIEVersion == 9) {
return 9;
} else if(fIEVersion == 10) {
return 10;
} else {
//IE版本<=7
return 6;
}
} else if(isEdge) {
//edge
return 'edge';
} else if(isIE11) {
//IE11
return 11;
}
}
IE浏览器兼容部分问题整理(后期如果遇到会及时更新)
IE --- 前端开发的恶梦
PS:在JS 开发中 一般会遇到各种对象的初始化,然而在IE中初始化 时间(Date)对象时,又开始各种作怪!
如:new Date("2018-01-01 00:00:00"); ------ 输出结果为 ------> NaN (你敢相信吗?)
处理方式为: 在初始化时间前,先对 “-” 进行替换处理,替换为 "/"
如:2018-01-01 00:00:00 需 替换为 2018/01/01 00:00:00 才能初始化
为了节约成本,干脆重新构造时间对象初识方法
如:
/**
* Date 方法重载,时间 new Date(String) 兼容所有浏览器
* @param {Object} dateString
*/
var newDate = function(dateString) {
if(checkBrowser() == "ie") {
if(typeof dateString == "string") {
if(dateString.toString().indexOf("-") > -1) {
dateString = dateString.replace(/-/g, "/");
}
}
}
if (dateString == undefined || dateString == null || dateString == "") {
return new Date();
} else{
return new Date(dateString);
}
};
初始化时间时统一使用 new newDate("2018-01-01 00:00:00") 形式
如果浏览器是IE浏览器,并且版本为 IE8、IE9时,需进行如下配置 才能实现 前后端分离时的跨域(ajax请求)问题
1、检验用户是否设置IE允许访问跨域资源
//只在IE10以下才出现跨域无法访问问题
if (IEVersion() < 10) {
try {
var WshShell = new ActiveXObject("WScript.Shell");
//读取系统注册表中是否允许 IE通过域访问数据源 3=禁用、0=启用、1=提示
if (WshShell.RegRead("HKCU\\Software\\Microsoft\\Windows\\CurrentVersion\\Internet Settings\\Zones\\3\\1406") != 0) {
// 这种情况有两种
// *****************方式1、提示用户,叫用户去设置******************************************
layer.confirm('当前浏览器尚不支持跨域访问资源,请问是否去设置访问?', {
btn: ['是', '否']//按钮
}, function () {
//设置允许 IE通过域访问数据源页面
//设置 功能控件的教程 (https://blog.csdn.net/qq_26848943/article/details/89329223)
window.location.href = "view/IE-Page/ie-9.html#jsonP"
}, function () {
layer.alert("必须设置后才能访问跨域的资源哦!");
});
// *****************方式12、提示用户,询问用户是否系统帮他设置 ******************************************
layer.confirm('当前浏览器尚不支持跨域访问资源,请问是否去设置访问?', {
btn: ['是', '否']//按钮
}, function () {
//设置允许 IE通过域访问数据源页面
//(设置Windows 系统注册表方式:https://blog.csdn.net/bjash/article/details/8261835)
WshShell.RegWrite("HKCU\\Software\\Microsoft\\Windows\\CurrentVersion\\Internet Settings\\Zones\\3\\1406","0","REG_DWORD");
}, function () {
layer.alert("必须设置后才能访问跨域的资源哦!");
});
}
} catch (e) {
// 浏览器中 没有启用 对 activex对象初始化的支持
layer.confirm('当前浏览器访问需要设置一些功能控件,请问是否去设置访问?', {
btn: ['是', '否']//按钮
}, function () {
//设置 功能控件的教程 (https://blog.csdn.net/qq_26848943/article/details/89329223)
window.location.href = "view/IE-Page/ie-9.html"
}, function () {
layer.alert("必须设置后才能访问跨域的资源哦!");
});
}
}
以上的参考链接分别在如下的表格中:
功能 | 链接地址 |
---|---|
设置功能控件地址 | https://blog.csdn.net/qq_26848943/article/details/89329223 |
通过ActiveX控件读写系统注册表参考 | https://blog.csdn.net/bjash/article/details/8261835 |
2、对ajax请求设置全局的属性(相对于IE10以下版本)
if(IEVersion() < 10) {
$.ajaxSetup({
//解决jquery ajax在跨域访问post请求的时候,ie9以下无效(包括ie9)的问题
crossDomain: true == !(document.all),
});
}