无法在IE10中使用XmlHttpRequest加载Blob

时间:2013-06-17 12:15:00

标签: javascript html5 xmlhttprequest blob

我尝试从同一域内的图片路径(http路径)加载图片, 我一直在使用的方法是XmlHttpRequest,它在Chrome上运行正常,然后我在HTML5中的img标签内显示图像,

当我尝试在IE10中加载它时,它只是不起作用,status和readyState是正常的, 但是图片不会加载,当我检查XmlHttpRequest属性'response'时,它在Chrome上返回了blob对象,但它在IE10上返回undefined,

注意 :我在Chrome上使用了onload事件,但在IE上我使用了onreadystatechanged

这是我正在使用的代码:

           var xhr = new XMLHttpRequest();
           xhr.open("GET", "http://pathtomyimage/example.jpg", true);
           xhr.responseType = "blob";
           xhr.onreadystatechange = function (e) {
               if (xhr.readyState==4 && xhr.status==200) {
                   alert(xhr.response+" in IE");
                   var i;
                   i= document.getElementById("bg");
                   i.src = URL.createObjectURL(xhr.response);
               }
           };
           xhr.onload = function (e) {
               if (this.status == 200) {
                   var myBlob = this.response;
                   alert(myBlob+" inChrome");
                   var i;
                   i= document.getElementById("bg");
                   i.src = URL.createObjectURL(myBlob);
               }
           };
           xhr.onerror = function (e) {
               alert(e+"  error");
           };
           xhr.send();

在onreadystatechange内,IE10上的警报返回未定义,onload内的警报返回Chrome上的blob-object, 那么如何像在Chrome上一样在IE10上显示图像呢?

1 个答案:

答案 0 :(得分:0)

我在JsFiddle中尝试了您的代码,但更改了网址并且有效。

xhr.open("GET", "http://fiddle.jshell.net/js/lib/dummy.js", true)

可能您没有在标准模式下使用IE。

按F12查看这些内容:

Browser Mode: IE10

Document Mode: Standards