IE8 jquery ajax获取静态资源报错TypeError 拒绝访问

简介: <div class="markdown_views"><p><strong>1. 出现问题的代码</strong></p><pre class="prettyprint"><code class="language-javascript hljs "> <span class="hljs-comment">/*** * 请求静态html 模板 * @

1. 出现问题的代码

 /***
     * 请求静态html 模板
     * @param url
     * @param $jqueryDiv : 四个主要div之一
     * @param templateHandle : 自定义,用于使用Dot js模板函数
     * @param callback : 用于实现模板之后,绑定事件
     * @param templateData : cia的返回数据
     */
    ajaxHtml: function (url, $jqueryDiv, templateHandle, callback, templateData) {
        xhr.ajaxHtmlCommon(url, $jqueryDiv, null, templateHandle, callback, templateData);
    },
    /***
     * ajax 请求静态html文件
     * @param url
     * @param $jqueryDiv
     * @param data
     * @param callback : 回调函数,updateHtml 方法之后执行
     */
    ajaxHtmlCommon: function (url, $jqueryDiv, requestData, templateHandle, callback, templateData) {
        var argument_length = arguments.length;
        var isHasCallback = (argument_length > 4 && callback && typeof callback === 'function');
        var options22 = {
            url: url,
            type: "GET",
            timeout: 18000,
            dataType: 'html',
            success: function (html) {
                updateHtml($jqueryDiv, html, templateHandle, templateData);
                /* var $formInput = jqueryObj.find('textarea:first');//让subContent 中的textarea聚焦
                 if ($formInput.length != 0) {//先判断能不能获取到textarea
                 $formInput.get(0).focus();
                 }*/
                if (isHasCallback) {
                    callback($jqueryDiv, html);
                }
            },
            error: function (er) {
                if (er.statusText == 'timeout') {
                    updateHtml($jqueryDiv, "<div style='color: red'>连接服务器超时!</div>");
                } else {
                    var errorMessage2;
                    if (er.responseText) {
                        errorMessage2 = er.responseText;
                    } else {
                        errorMessage2 = er.statusText;
                    }
                    console.log('error:' + errorMessage2);
                    updateHtml($jqueryDiv, errorMessage2, templateHandle, templateData);
                }
                if (isHasCallback) {
                    callback($jqueryDiv, er);
                }
            }
        };
        if (argument_length > 2 && requestData != null && requestData != undefined) {
            options22.data = requestData;
            options22.type = "POST";
        }
        $.ajax(options22);
    }

浏览器版本:IE8
获取html模板时报错:

var ajaxHtml4IE8 = function () {
            xhr.ajaxHtml('cross_domain.html', $('#crossDiv'), null, null, null);
        }

报错信息:TypeError 拒绝访问

2. 解决方法:

(1)在js文件头部增加:

jQuery.support.cors = true;

(2) html文件引入jQuery.XDomainRequest.js

<!--[if IE 8]>
    <script type="text/javascript"
            src="jQuery.XDomainRequest.js"></script>
    <![endif]-->

(3) 静态html模板前面增加:
< meta http-equiv=”Access-Control-Allow-Origin” content=”*”>
静态html模板

注意:
(1)静态HTML模板前要增加,表示服务器端支持跨域.
(2)只有IE8 才有跨域拒绝访问的问题,所以引入第三方js文件时,要使用< !–[if IE 8]>
(3)jquery-1.11.1.js 及以上版本不支持IE8
jQuery.XDomainRequest.js 见附件
参考:https://github.com/MoonScript/jQuery-ajaxTransport-XDomainRequest
http://stackoverflow.com/questions/10232017/ie9-jquery-ajax-with-cors-returns-access-is-denied

相关文章
|
5月前
|
XML 前端开发 JavaScript
什么是Ajax和jquery
什么是Ajax和jquery
38 0
|
4月前
|
JSON 前端开发 Java
利用Spring Boot处理JSON数据实战(包括jQuery,html,ajax)附源码 超详细
利用Spring Boot处理JSON数据实战(包括jQuery,html,ajax)附源码 超详细
57 0
|
4月前
|
敏捷开发 JavaScript 前端开发
❤❤❤【Vue.js最新版】sd.js基于jQuery Ajax最新原生完整版for凯哥API版本❤❤❤
❤❤❤【Vue.js最新版】sd.js基于jQuery Ajax最新原生完整版for凯哥API版本❤❤❤
|
5月前
|
JavaScript 前端开发 Java
bootsrap+jquery+组件项目引入文件的常见报错
bootsrap+jquery+组件项目引入文件的常见报错
47 0
|
6月前
|
缓存 JavaScript 前端开发
vuecli3 项目在 ie11 下面白屏报错:SCRIPT1002: 语法错误
vuecli3 项目在 ie11 下面白屏报错:SCRIPT1002: 语法错误
72 0
|
3月前
|
前端开发 JavaScript
Jquery ajax捕获错误信息
Jquery ajax捕获错误信息
16 0
|
8月前
|
前端开发 JavaScript
jQuery中的Ajax请求----ajax请求篇(二)
在jQuery中的Ajax请求其实是在底层对原生js请求方式的封装,那么jQuery中的Ajax请求是怎样的呢?
42 0
|
3月前
|
JSON 缓存 前端开发
Jquery中AJAX的应用
Jquery中AJAX的应用
41 0
|
4月前
|
JSON 前端开发 JavaScript
jQuery中ajax的使用
jQuery中ajax的使用
|
4月前
|
XML JavaScript 前端开发
【Web智能聊天客服】之JavaScript、jQuery、AJAX讲解及实例(超详细必看 附源码)
【Web智能聊天客服】之JavaScript、jQuery、AJAX讲解及实例(超详细必看 附源码)
48 0