English 中文(简体)
INVALID_STATE_ERR: DOM 异常 11
原标题:INVALID_STATE_ERR: DOM Exception 11

我正在开发一个简单的辅助类来使用XmlHttpRequest发送请求(如下代码)。但是我无法使它工作。例如在谷歌浏览器中,我收到错误INVALID_STATE_ERR: DOM异常11,在其他浏览器中,我收到状态== 0。

//@method XRequest: Object constructor. As this implements a singleton, the object can t be created calling the constructor, GetInstance should be called instead
function XRequest() {
    this.XHR = XRequest.CreateXHR();
}
XRequest.instance = null;

//@method static GetInstance: Creates a singleton object of type XRequest. Should be called whenever an object of that type is required.
//@return: an instance of a XRequest object
XRequest.GetInstance = function() {
    if(XRequest.instance == null) {
        XRequest.instance = new XRequest();
    }
    return XRequest.instance;
}

//@method static CreateXHR: Implments a basic factory method for creating a XMLHttpRequest object
//@return: XMLHttp object or null
XRequest.CreateXHR = function() {
    var xhr = null;
    var factory = [
        function() { return new XMLHttpRequest(); },
        function() { return new ActiveXObject("Msxml2.XMLHTTP"); },
        function() { return new ActiveXObject("Microsoft.XMLHTTP"); }
    ];

    for(var i = 0; i < factory.length; ++i) {
        var f = factory[i];
        xhr = f();
        if(xhr) return xhr;
    }
    return null;
}

XRequest.prototype.SetRequestHeader = function(name, value) {
    if(this.XHR) {
        this.XHR.setRequestHeader(name, value);
    }
}

XRequest.prototype.SendRequest = function(args) {
    var async = true;
    var type = "";
    var url = "";
    var username = "";
    var password = "";
    var body = null;
    var success = null; 
    var failure = null;

    for(e in args) {
        switch(e) {
            case "async":
                async = args[e];
                break;
            case "type":
                type = args[e];
                break;
            case "success":
                success = args[e];
                break;
            case "failure":
                failure = args[e];
                break;
            case "url":
                url = args[e];
                break;
            case "username":
                username = args[e];
                break;
            case "password":
                password = args[e];
                break;
            case "body":
                body = args[e];
            break;
            case "setHeader":
                var h = args[e].split(":");
                if(h.length == 2) {
                    this.SetRequestHeader(h[0], h[1]);
                }
                break;
        }
    }

    var that = this;
    this.XHR.onreadystatechange = function() {
        alert("readyState == " + that.XHR.readyState + "  status == " + that.XHR.status);
        if(that.XHR.readyState == 4) {
            if(that.XHR.status == 200 || that.XHR.status == 0) {
                if(success) success(that.XHR);
            } else {
                if(failure) failure();
            }
        }
    };
    this.XHR.open(type, url, async, username, password);
    this.XHR.send(body);
}

www.un.org/Depts/DGACM/index_spanish.htm 使用情况实例:

<script language="javascript">
    function onLoad() {
        var x = XRequest.GetInstance();
        x.SendRequest({type:"GET",
            setHeader:"Accept:text/html, image/png, image/*, */*",
            url: "http://your_server.com/getData?param1=test",
            success:onSuccess, failure:onFail
        });
    }

    function onSuccess(obj) {
        alert("OK");                
    }

    function onFail() {
        alert("Not at this time!");
    }
</script>
最佳回答

无论如何,您都可以通过创建混合组件来简化您的SendRequest方法,而不是使用巨大的switch

XRequest。prototype。SendRequest = function(params) {
    var defaultParams = {
        async:    true,
        type:     "",
        url:      "",
        username: "",
        password: "",
        body:     null,
        success:  null,
        failure:  null
    };

    for ( var i in defaultParams ) {
        if ( defaultParams。hasOwnProperty(i) && typeof params[i] == "undefined" ) {
            params[i] = defaultParams[i];
        }
    }

    var that = this;
    this。XHR。onreadystatechange = function() {
        if ( that。XHR。readyState == 4 ) {
            if ( that。XHR。status == 200 || that。XHR。status == 0 ) {
                if ( params。success ) {
                    params。success(that。XHR);
                }
            } else {
                if ( params。failure ) {
                    params。failure();
                }
            }
        }
    };

    this。XHR。open(
        params。type, parms。url, params。async, params。username, params。password
    );

    // It doesn t make sense to have a for/switch here when you re only handling
    // one case
    if ( params。setHeader ) {
        var h = params。setHeader。split(":");
        if ( h。length == 2) {
            this。SetRequestHeader(h[0], h[1]);
        }
    }

    this。XHR。send(params。body);
};

同样要小心:你现有的for。。in循环有两个明显的问题:

  1. You re not using var and causing a global to be created: for (e in args) should be for (var e in args)
  2. Whenever you use for。。in, you should always check to make sure that each key is a direct member of the object, and not something inherited inadvertently through prototype

for ( var i in obj ) {
    if ( obj。hasOwnProperty(i) ) {
        // do stuff here
    }
}
问题回答

这个ajax库有问题。

XHR.setRequestHeader()必须在XHR.open()之后调用。

// @method XRequest: Object constructor. As this implements a singleton, the object can t be created calling the constructor, GetInstance should be called instead
function XRequest()
{
    this.XHR = XRequest.CreateXHR();
}

XRequest.instance = null;


// @method static GetInstance: Creates a singleton object of type XRequest. Should be called whenever an object of that type is required.
// @return: an instance of a XRequest object
XRequest.GetInstance = function()
{
    if(XRequest.instance == null)
    {
        XRequest.instance = new XRequest();
    }

    return XRequest.instance;
}

// @method static CreateXHR: Implments a basic factory method for creating a XMLHttpRequest object
// @return: XMLHttp object or null
XRequest.CreateXHR = function()
{
    var xhr = null;
    var factory = [
                    function() { return new XMLHttpRequest(); },
                    function() { return new ActiveXObject("Msxml2.XMLHTTP"); },
                    function() { return new ActiveXObject("Microsoft.XMLHTTP"); }
                ];

    for(var i = 0; i < factory.length; ++i)
    {
        var f = factory[i];
        xhr = f();
        if(xhr)
            return xhr;
    }

    return null;
}

XRequest.prototype.SetRequestHeader = function(name, value)
{
    if(this.XHR)
    {
        //alert(name+ ||| +value);
        this.XHR.setRequestHeader(name, value);
    }
}

XRequest.prototype.SendRequest = function(args)
{
    var async = true;
    var type = "";
    var url = "";
    var username = "";
    var password = "";
    var body = null;
    var success = null; 
    var failure = null;

    for(e in args)
    {
        switch(e)
        {
            case "async":
                async = args[e];
                break;

            case "type":
                type = args[e];
                break;

            case "success":
                success = args[e];
                break;
            case "failure":
                failure = args[e];
                break;

            case "url":
                url = args[e];
                break;

            case "username":
                username = args[e];
                break;

            case "password":
                password = args[e];
                break;

            case "body":
                body = args[e];
                break;
        }
    }

    var that = this;
    this.XHR.onreadystatechange = function()
        {
            alert("readyState == " + that.XHR.readyState + "  status == " + that.XHR.status);
            if(that.XHR.readyState == 4)
            {
                if(that.XHR.status == 200 || that.XHR.status == 0)
                {
                    if(success)
                        success(that.XHR);
                }
                else
                {
                    if(failure)
                        failure();
                }
            }
        };

    this.XHR.open(type, url, async, username, password);
    for(e in args)
    {
        switch(e)
        {
            case "setHeader":
                var h = args[e].split(":");             
                if(h.length == 2)
                {
                    this.SetRequestHeader(h[0], h[1]);
                }
                break;
        }
    }
    this.XHR.send(body);
}

通常,在XMLHttpRequest中,当你把公开方法称作“inc = 真实”,或者你将“合成参数”从未作界定后推到“同步”,然后你获得地位或对应财产。 这些财产只有在你发出同步呼吁后,或者在准备就绪的国家(如果发出不成熟的呼声)之后才能得到。 我建议,你首先以“yn”为幌子,然后改用“ReadyStateChange”。

在我的情况下,当我尝试在xhr.onreadystatechange方法中访问xhr.statusText时发生了错误,但检索xhr.readyState则很顺利。





相关问题
selected text in iframe

How to get a selected text inside a iframe. I my page i m having a iframe which is editable true. So how can i get the selected text in that iframe.

How to fire event handlers on the link using javascript

I would like to click a link in my page using javascript. I would like to Fire event handlers on the link without navigating. How can this be done? This has to work both in firefox and Internet ...

How to Add script codes before the </body> tag ASP.NET

Heres the problem, In Masterpage, the google analytics code were pasted before the end of body tag. In ASPX page, I need to generate a script (google addItem tracker) using codebehind ClientScript ...

Clipboard access using Javascript - sans Flash?

Is there a reliable way to access the client machine s clipboard using Javascript? I continue to run into permissions issues when attempting to do this. How does Google Docs do this? Do they use ...

javascript debugging question

I have a large javascript which I didn t write but I need to use it and I m slowely going trough it trying to figure out what does it do and how, I m using alert to print out what it does but now I ...

Parsing date like twitter

I ve made a little forum and I want parse the date on newest posts like twitter, you know "posted 40 minutes ago ","posted 1 hour ago"... What s the best way ? Thanx.

热门标签