FreeOZ论坛

标题: 继续吐槽IE [打印本页]

作者: 周星星1832 时间: 13-8-2014 22:15
标题: 继续吐槽IE
因为还在测试中。。。
所以又发现两个ie的问题。。。。

IE 11 iframe access denied.
就是load something to hidden ifrmae 然后获取load content 的内容。
ie 11 报错access denied. 就是不能accss ifrmae 即使load host 是相同的。。。。。。

解决办法
就是在header 里加上 x-frame-options SAMEORIGIN.....

无语。。。。。

另外一个其实不是问题。。算是经验分享吧。。。

需要用iframe 传回json data..而获取json数据的方法ie又有不同

firefox chrome 啥的。。用document.find("body pre")
而ie 有时需要 document.find("body").

作者: ubuntuhk 时间: 13-8-2014 22:18
IE果然奇葩。。。

作者: 周星星1832 时间: 13-8-2014 22:20

ubuntuhk 发表于 13-8-2014 21:18
IE果然奇葩。。。

ie 就是噩梦。。。即使11了还是噩梦。。。。

作者: mason00 时间: 13-8-2014 22:38
第二个等用jQuery来拿吗？可能会解决这种不一致

作者: mason00 时间: 13-8-2014 22:40
第一个不懂，为什么要用hidden iframe呢？要异步吗？可以不用iframe吗？

作者: 周星星1832 时间: 13-8-2014 23:29

mason00 发表于 13-8-2014 21:40
第一个不懂，为什么要用hidden iframe呢？要异步吗？可以不用iframe吗？

用hidden iframe是因为要做ajax file upload的效果。。。

就是说post file到ifrmae然后返回json data到iframe，然后获取data..再转为json

作者: mason00 时间: 14-8-2014 00:29

周星星1832 发表于 13-8-2014 22:29
用hidden iframe是因为要做ajax file upload的效果。。。

就是说post file到ifrmae然后返回json data ...

可以用多个form做ajax file uploading吧

作者: 周星星1832 时间: 14-8-2014 07:57

mason00 发表于 13-8-2014 23:29
可以用多个form做ajax file uploading吧

Ajax 不能upliad file

作者: mason00 时间: 14-8-2014 07:59

周星星1832 发表于 14-8-2014 06:57
Ajax 不能upliad file

可以吧，new一个xmlrequest，设头，attach form data,还有很多异步上传文件的插件咯

作者: mason00 时间: 14-8-2014 08:02
所以起码要ie10才是现代浏览器

file upload is not possible through ajax. You can upload file, without refreshing page by using IFrame. you can check further detail here

UPDATE:

With XHR2, File upload through AJAX is supported. E.g. through FormData object, but unfortunately it is not supported by all/old browsers.

FormData support starts from following desktop browsers versions. IE 10+, Firefox 4.0+, Chrome 7+, Safari 5+, Opera 12+

For more detail, see MDN link

作者: 周星星1832 时间: 14-8-2014 08:03

mason00 发表于 14-8-2014 07:02
所以起码要ie10才是现代浏览器

file upload is not possible through ajax. You can upload file, witho ...

还要支持一少部分ie7呢

作者: michaelsusu 时间: 14-8-2014 10:16
原来周老板也是做IT的

作者: 周星星1832 时间: 14-8-2014 10:25

michaelsusu 发表于 14-8-2014 09:16
原来周老板也是做IT的

是的哈

作者: spaceship 时间: 14-8-2014 10:53
IE是Web开发者的噩梦，话说很多人讨厌微软就是从IE开始的。

作者: justinfang 时间: 14-8-2014 11:58
safari and chrome are the best

作者: diouf 时间: 14-8-2014 12:36
http://blueimp.github.io/jQuery-File-Upload/

作者: diouf 时间: 14-8-2014 12:37
另外老板不用jQuery来查找element也是很奇葩的...

作者: 周星星1832 时间: 14-8-2014 12:42

diouf 发表于 14-8-2014 11:36
http://blueimp.github.io/jQuery-File-Upload/

其时我就是用jquery 的一个plug in来ajax上传的file的。。那个用hidden ifrmae..而且代码很短。。容易自己改动。。

這個看着功能还是挺多的

作者: 周星星1832 时间: 14-8-2014 12:42

diouf 发表于 14-8-2014 11:37
另外老板不用jQuery来查找element也是很奇葩的...

why???

作者: diouf 时间: 14-8-2014 12:49

周星星1832 发表于 14-8-2014 11:42
why???

firefox chrome 啥的。。用document.find("body pre")
而ie 有时需要 document.find("body").

因为jQuery 只需要 var body =$('body'); 就完事了爱用啥浏览器用啥不影响我开发...

作者: 周星星1832 时间: 14-8-2014 12:59

diouf 发表于 14-8-2014 11:49
firefox chrome 啥的。。用document.find("body pre")
而ie 有时需要 document.find("body").

晕。。
其时用的就是jquery..

只不过不同的浏览器用iframe load content, 尤其是json data的时候会不同。。比入firefox就会在body tag后面加个pre 而ie则沒有

所以要用两个selector。。

作者: black_zerg 时间: 15-8-2014 12:52
提示: 作者被禁止或删除, 无法发言 Didn't know there is document.find. Always use queryselector

作者: 周星星1832 时间: 15-8-2014 12:59

black_zerg 发表于 15-8-2014 11:52
Didn't know there is document.find. Always use queryselector

那是伪代码。。。。。。。。晕

作者: 周星星1832 时间: 15-8-2014 13:04
the jquery is actually

iframe.contents().find('body pre');
iframe.contents().find('body');

作者: mason00 时间: 15-8-2014 13:09
Jquery就是解决早期浏览器JavaScript标准不一样而成名的。ie确实垃圾，jquery最后也不支持太早的ie了

作者: 周星星1832 时间: 15-8-2014 13:17

mason00 发表于 15-8-2014 12:09
Jquery就是解决早期浏览器JavaScript标准不一样而成名的。ie确实垃圾，jquery最后也不支持太早的ie了

jquey 1.x 支持ie6+
jquery 2.x 支持ie9+

所以还得继续用jqeury 1.x

作者: diouf 时间: 15-8-2014 14:01
只有内网系统才会考虑2.x
1.9/1.10 都很好用很稳定了已经

作者: 周星星1832 时间: 15-8-2014 14:04

diouf 发表于 15-8-2014 13:01
只有内网系统才会考虑2.x
1.9/1.10 都很好用很稳定了已经

en ...不知道2.x多少个bug。。。
其实jquery bug 也不少

作者: mason00 时间: 15-8-2014 14:10

diouf 发表于 15-8-2014 13:01
只有内网系统才会考虑2.x
1.9/1.10 都很好用很稳定了已经

2.x是支持最新的html 5特性的，内核支持不一样，一般selector是差不多，但是ie带给框架的负担实在太重了

作者: DDD888 时间: 15-8-2014 14:37

周星星1832 发表于 15-8-2014 12:17
jquey 1.x 支持ie6+
jquery 2.x 支持ie9+

是呀，我也不得不用jquery 1.x啦

作者: caoglish 时间: 16-8-2014 19:16
跨浏览器开发应该使用的一些经验

一些关于跨浏览器/设备的工具
1. modernizr.js 特性检测器，有就使用原生，没有就加载polyfill
2. polyfill/shim 向后兼容的浏览器的js补丁，一般和modernizr一起用
3. jshint.js js语法检测器
4. Boilerplate 开发的最佳实践的初始模板
5. 阅读第三方库关于最低版本支持
6. 使用js单元测试，测试目标浏览器
7. Responsive Design （针对屏幕大小）

一个策略：
另外，我一直说的一个策略：把浏览器分两类，一类是历史遗留浏览器，一类是现代浏览器，然后根据这个分类开发两个版本的网站，然后自己定义那些浏览器是历史遗留版本，凡是历史遗留版本浏览器，统统使用历史遗留版界面，然后通过Message system明确告知本版本有些功能不能使用，尽快转移到现代浏览器上。然后现代浏览器的网站版本，功能全开，提供最好的用户体验。

最后手段：
最后方案，就是直接使用jReject.js这类插件，弹出overlay，告诉用户这个网站IE不能用，请使用firefox和chrome.(这个是最后手段，以上方案都失效的情况下使用。)

一个提醒：
跨浏览器兼容问题，过去有，现在有，以后会更麻烦，所以这个问题在你的项目开始前，就必须确定下来最低支持的版本是什么，然后设计一个对应兼容方案。

不要等开发完毕了，才告知要必须兼容个ie6啥的，那你的项目就有得好改了。

面向未来：
明年es6就要正式完成了，等es6出来后，如何把es6的javascript向后兼容呢？这里我有个概念，还没实验过：

1.使用es6编译器把代码导出成es5代码
2.使用modernzr检查浏览器是否支持es6，支持用es6代码；不支持，用编译好的es5代码并且加载es6shim。
3.使用grunt把es6编译过程完全自动化

以上这个方案，应该可以使用es6代码去兼容所有的浏览器了。

作者: 周星星1832 时间: 16-8-2014 21:34

caoglish 发表于 16-8-2014 18:16
跨浏览器开发应该使用的一些经验

一些关于跨浏览器/设备的工具

. modernizr.js
不错

作者: caoglish 时间: 16-8-2014 23:11

周星星1832 发表于 15-8-2014 12:17
jquey 1.x 支持ie6+
jquery 2.x 支持ie9+

jquery官方网站上有说明，如何两个一起写在html中，然后页面会根据browser的版本，自动加载相应的jquery

http://blog.jquery.com/2013/03/01/jquery-2-0-beta-2-released/

<!--[if lt IE 9]>
<script src="jquery-1.9.1.js"></script>
<![endif]-->
<script src="jquery-2.0.0b2.js"></script>

复制代码

但这个语法不能保证在未来的IE版本中继续工作...可以谨慎使用。

作者: 周星星1832 时间: 17-8-2014 07:56

caoglish 发表于 16-8-2014 22:11
jquery官方网站上有说明，如何两个一起写在html中，然后页面会根据browser的版本，自动加载相应的jquery
...

ie 11已经不支持这个了
我觉得没必要弄两个，。。

弄两个意味着要维护两个。。。

作者: DDD888 时间: 19-8-2014 10:33
我测试了下，竟然ie6能够运行我写的网站，就是速度慢许多，和老板商量了下，不支持ie6和ie7

作者: 周星星1832 时间: 19-8-2014 10:37

DDD888 发表于 19-8-2014 09:33
我测试了下，竟然ie6能够运行我写的网站，就是速度慢许多，和老板商量了下，不支持ie6和ie7

good on u

作者: DDD888 时间: 19-8-2014 12:03

周星星1832 发表于 19-8-2014 09:37
good on u

Thanks

遇到用户使用ie6或者ie7,网站推荐用户使用google chrome

欢迎光临 FreeOZ论坛 (https://www.freeoz.org/ibbs/)