网站适配IE浏览器的几个注意事项

注意事项目录

网站适配IE浏览器的几个注意事项
- 1、ajax请求date数据格式:
- 2、部分js插件需要引入对应的js文件才能生效
- 2、判断不同浏览器内核后使用对应的方法
- 2、IE浏览器常见报错
- - 1）、无效字符：
  - 2）、js导出excel文件，传递给系统调用的数据区域太小：
  - 3）、InvalidCharacterError

1、ajax请求date数据格式:

错误示范

$.ajax({url: 'url',type: 'POST',data: {data: "data",},success: function (e) {}
})

正确示范(最后一个date值不能有“，”)

$.ajax({url: 'url',type: 'POST',data: {data: "data"},success: function (e) {}
})

2、部分js插件需要引入对应的js文件才能生效

例如：sweetalert弹框插件，在IE浏览器正常运行，需要引入promise.auto.js,在chorme浏览器则不需要
IE正常使用该插件有两种方法：
1、cdn地址：https://cdn.bootcss.com/es6-promise/4.1.1/es6-promise.auto.js
2、以下代码不会与IE11一起运行：

swal({title: 'Are you sure?',text: "You won't be able to revert this!",type: 'warning',showCancelButton: true,confirmButtonColor: '#3085d6',cancelButtonColor: '#d33',confirmButtonText: 'Yes, delete it!'
}).then((result) => {if (result.value) {swal('Deleted!','Your file has been deleted.','success')}
})

解决此问题的简单方法是使用 function() 语法而不是 () =>

swal({title: 'Are you sure?',text: "You won't be able to revert this!",type: 'warning',showCancelButton: true,confirmButtonColor: '#3085d6',cancelButtonColor: '#d33',confirmButtonText: 'Yes, delete it!'
}).then(function(result) {if (result.value) {swal('Deleted!','Your file has been deleted.','success')}
})

2、判断不同浏览器内核后使用对应的方法

var ie = navigator.userAgent.match(/MSIE\s([\d.]+)/),ie11 = navigator.userAgent.match(/Trident\/7.0/) && navigator.userAgent.match(/rv:11/),ieEDGE = navigator.userAgent.match(/Edge/g),ieVer = (ie ? ie[1] : (ie11 ? 11 : (ieEDGE ? 12 : -1)));console.log('excelFileie:' + ie);console.log('excelFileieVer:' + ieVer);if (ie && ieVer < 10) {this.message.error('No blobs on IE<10');return;}if (ieVer > -1) {//IE} else {//chorme}

2、IE浏览器常见报错

1）、无效字符：

原本是：

`string text${expression}string text`

修改为

"string text "+expression+" string text"

2）、js导出excel文件，传递给系统调用的数据区域太小：

IE浏览器对URL的最大限制为2083个字符，如果超过这个数字，提交按钮没有任何反应。

function downloadFile(title, data) {const blob = new Blob([data], {type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;'});const ie = navigator.userAgent.match(/MSIE\s([\d.]+)/),ie11 = navigator.userAgent.match(/Trident\/7.0/) && navigator.userAgent.match(/rv:11/),ieEDGE = navigator.userAgent.match(/Edge/g),ieVer = (ie ? ie[1] : (ie11 ? 11 : (ieEDGE ? 12 : -1)));console.log('ie:' + ie);console.log('ieVer:' + ieVer);if (ie && ieVer < 10) {this.message.error('No blobs on IE<10');return;}if (ieVer > -1) {window.navigator.msSaveBlob(blob, title);} else {const url = window.URL.createObjectURL(blob);let link = document.createElement('a');link.setAttribute('href', url);link.setAttribute('download', title);document.body.appendChild(link);link.click();document.body.removeChild(link);}}

3）、InvalidCharacterError

//创建HTML元素的js代码， 例如ajaxfileupload.js, 行10 字符17代码：var io = document.createElement("<iframe id='" + frameId + "' name='" + frameId + "' />");
//以上代码在IE10下报如下错误：
//SCRIPT5022: InvalidCharacterError
//解决办法，改成如下兼容写法：
var io=document.createElement("iframe");
io.id=frameId;
io.name=frameId;
//以上代码出至  ajaxfileupload.js, 行10 字符17  使用ajaxfileupload.js需把此行更改成上面那样，才能在IE10正常运行。

网站适配IE浏览器的几个注意事项相关推荐

3个pc网站适配手机的方法
新的形势下,移动网站的使用率越来越高.移动网站的优化如何做被更多的人所关注.这里切图移动就从目前三种比较常用的pc站点移动配置方式,并从性能,需求,成本方面对三者进行了分析,并给出相应的优化建议.pc ...
Nginx 配置网站适配PC和手机
为什么80%的码农都做不了架构师?>>> 考虑到网站的在多种设备下的兼容性,有很多网站会有手机版和电脑版两个版本.访问同一个网站URL,当服务端识别出用户使用电脑访问,就打开电 ...
HTML`CSS_网站页面不同浏览器兼容性问题解决
HTML`CSS_网站页面不同浏览器兼容性问题解决参考文章: (1)HTML`CSS_网站页面不同浏览器兼容性问题解决 (2)https://www.cnblogs.com/phoebeyue/p/ ...
宝藏网站系列：浏览器书签共享平台
苏生不惑第180篇原创文章,将本公众号设为星标,第一时间看最新文章. 之前分享过宝藏网站这个网站堪称宝藏,收藏起来吧 ,宝藏网站系列:这个网站号称万能 ,今天分享的是宝藏网站系列之浏览器书签共享平台 ...
恶意网站可利用浏览器扩展 API，窃取浏览器数据
恶意网站可以利用浏览器扩展 API,在浏览器内执行代码,来窃取用户敏感信息,比如用户书签.历史浏览记录和 cookies.在这之后,攻击者可能劫持用户的登陆会话.而敏感账户像是电子邮件.社交媒体或工作 ...
政府网站用什么浏览器打开，除了ie还能哪些浏览器
相信很多人都遇到过这样子的情况,当我们登录政府网站的时候,使用Chrome或者firefox 等非IE核的浏览器时,总是打不开网站,并出现提示下载安装一个登录控件,然而下载安装后,依然有这个提示.那么 ...
30分钟开发一款抓取网站图片资源的浏览器插件
前言由于业务需求, 笔者要为公司开发几款实用的浏览器插件,所以大致花了一天的时间,看完了谷歌浏览器插件开发文档,在这里特地总结一下经验, 并通过一个实际案例来复盘插件开发的流程和注意事项. 你将收获 ...
电子商务网站建设策划书_网站建设及推广的5大注意事项
如果你是一个相对成熟的企业,我们在建立网站的时候,总是会让网站开发人员,撰写一个网站策划书,通常而言,我们在做网站策划的时候,一份网站策划书主要包括如下一个因素: ①营销型网站的建立,页面样式的视觉体 ...
玉米社：网站seo站外优化技巧、注意事项
网站seo站外优化技巧.注意事项. 1.不与添加nofollow属性的友链进行交换 nofollow属性旨在告诉搜索引擎,不要对该链接进行抓取追踪和权重传递,原本,友情链接是网站交换双方权重的双向传递 ...

网站适配IE浏览器的几个注意事项

网站适配IE浏览器的几个注意事项

注意事项目录

1、ajax请求date数据格式:

2、部分js插件需要引入对应的js文件才能生效

2、判断不同浏览器内核后使用对应的方法

2、IE浏览器常见报错

1）、无效字符：

2）、js导出excel文件，传递给系统调用的数据区域太小：

3）、InvalidCharacterError

网站适配IE浏览器的几个注意事项相关推荐

最新文章

热门文章