我一直有一些奇怪的问题,当谈到做一个AJAX请求和处理响应。
我想提出一个Ajax调用的XML文件。 然而,当我得到xhr.responseText属性在Firefox,但不是在IE工作正常的反应。 另一件事是,我试图访问xhr.responseXML为的XMLDocument,但它告诉我在Firefox它告诉我,xhr.responseXML是不确定的,即它甚至犯规告诉我不确定错误或显示输出。
这是我使用发出请求的代码:
var ajaxReq = function(url, callback) {
//initialize the xhr object and settings
var xhr = window.ActiveXObject ?
new ActiveXObject("Microsoft.XMLHTTP") : new XMLHttpRequest(),
//set the successful connection function
httpSuccess = function(xhr) {
try {
// IE error sometimes returns 1223 when it should be 204
// so treat it as success, see XMLHTTPRequest #1450
// this code is taken from the jQuery library with some modification.
return !xhr.status && xhr.status == 0 ||
(xhr.status >= 200 && xhr.status < 300) ||
xhr.status == 304 || xhr.status == 1223;
} catch (e) { }
return false;
};
//making sure the request is created
if (!xhr) {
return 404; // Not Found
}
//setting the function that is going to be called after the request is made
xhr.onreadystatechange = function() {
if (!httpSuccess(xhr)) {
return 503; //Service Unavailable
}
if (xhr.responseXML != null && xhr.responseText != null &&
xhr.responseXML != undefined && xhr.responseText != undefined) {
callback(xhr);
}
};
//open request call
xhr.open('GET', url, true);
//setup the headers
try {
xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
xhr.setRequestHeader("Accept", "text/xml, application/xml, text/plain");
} catch ( ex ) {
window.alert('error' + ex.toString());
}
//send the request
try {
xhr.send('');
} catch (e) {
return 400; //bad request
}
return xhr;
};
这就是我如何调用该函数测试结果:
window.onload = function() {
ajaxReq('ConferenceRoomSchedules.xml', function(xhr) {
//in firefox this line works fine,
//but in ie it doesnt not even showing an error
window.document.getElementById('schedule').innerHTML = xhr.responseText;
//firefox says ''xhr.responseXML is undefined'.
//and ie doesn't even show error or even alerts it.
window.alert(xhr.reponseXML.documentElement.nodeName);
});
}
这也是我第一次用AJAX来工作,所以有可能是我没有看不对头尝试。 我一直对为什么或如何解决它的任何迹象搜索疯了,但没有运气。 任何想法将是巨大的。
编辑:
我知道这将是更好的框架,但老板不想添加一个框架,只是一个ajax功能(“只是”不是阿贾克斯公平的一句话:P)。 所以我用纯JavaScript这样做。
XML文件是良好的,我看到它以及在网络浏览器,但完成这是我使用的测试文件:
<?xml version="1.0" encoding="utf-8"?>
<rooms>
<room id="Blue_Room">
<administrator>somebody@department</administrator>
<schedule>
<event>
<requester>
<name>Johnny Bravo</name>
<email>jbravo@department</email>
</requester>
<date>2009/09/03</date>
<start_time>11:00:00 GMT-0600</start_time>
<end_time>12:00:00 GMT-0600</end_time>
</event>
</schedule>
</room>
<room id="Red_Room">
<administrator>somebody@department</administrator>
<schedule>
</schedule>
</room>
<room id="Yellow_Room">
<administrator>somebody@department</administrator>
<schedule>
</schedule>
</room>
</rooms>
编辑2:好了,好消息是,我说服我的老板使用jQuery,坏消息是,AJAX仍然困扰我。 我会阅读更多关于它只是好奇。 感谢您的提示,我给出的答案信贷热吝啬鬼,因为他是最接近的工作提示。
我在几年前有同样的问题,于是我放弃了responseXML的,开始总是使用responseText的。 此分析功能一直为我工作:
function parseXml(xmlText){
try{
var text = xmlText;
//text = replaceAll(text,"<","<");
//text = replaceAll(text,">",">");
//text = replaceAll(text,""","\"");
//alert(text);
//var myWin = window.open('','win','resize=yes,scrollbars=yes');
//myWin.document.getElementsByTagName('body')[0].innerHTML = text;
if (typeof DOMParser != "undefined") {
// Mozilla, Firefox, and related browsers
var parser=new DOMParser();
var doc=parser.parseFromString(text,"text/xml");
//alert(text);
return doc;
}else if (typeof ActiveXObject != "undefined") {
// Internet Explorer.
var doc = new ActiveXObject("Microsoft.XMLDOM"); // Create an empty document
doc.loadXML(text); // Parse text into it
return doc; // Return it
}else{
// As a last resort, try loading the document from a data: URL
// This is supposed to work in Safari. Thanks to Manos Batsis and
// his Sarissa library (sarissa.sourceforge.net) for this technique.
var url = "data:text/xml;charset=utf-8," + encodeURIComponent(text);
var request = new XMLHttpRequest();
request.open("GET", url, false);
request.send(null);
return request.responseXML;
}
}catch(err){
alert("There was a problem parsing the xml:\n" + err.message);
}
}
有了这个XMLHttpRequest对象:
// The XMLHttpRequest class object
debug = false;
function Request (url,oFunction,type) {
this.funct = "";
// this.req = "";
this.url = url;
this.oFunction = oFunction;
this.type = type;
this.doXmlhttp = doXmlhttp;
this.loadXMLDoc = loadXMLDoc;
}
function doXmlhttp() {
//var funct = "";
if (this.type == 'text') {
this.funct = this.oFunction + '(req.responseText)';
} else {
this.funct = this.oFunction + '(req.responseXML)';
}
this.loadXMLDoc();
return false;
}
function loadXMLDoc() {
//alert(url);
var functionA = this.funct;
var req;
req = false;
function processReqChange() {
// alert('reqChange is being called');
// only if req shows "loaded"
if (req.readyState == 4) {
// only if "OK"
if (req.status == 200) {
// ...processing statements go here...
eval(functionA);
if(debug){
var debugWin = window.open('','aWindow','width=600,height=600,scrollbars=yes');
debugWin.document.body.innerHTML = req.responseText;
}
} else {
alert("There was a problem retrieving the data:\n" +
req.statusText + '\nstatus: ' + req.status);
if(debug){
var debugWin = window.open('','aWindow','width=600,height=600,scrollbars=yes');
debugWin.document.body.innerHTML = req.responseText;
}
}
}
}
// branch for native XMLHttpRequest object
if(window.XMLHttpRequest) {
try {
req = new XMLHttpRequest();
} catch(e) {
req = false;
}
// branch for IE/Windows ActiveX version
} else if(window.ActiveXObject) {
try {
req = new ActiveXObject("Msxml2.XMLHTTP");
} catch(e) {
try {
req = new ActiveXObject("Microsoft.XMLHTTP");
} catch(e) {
req = false;
}
}
}
if(req) {
req.onreadystatechange = processReqChange;
if(this.url.length > 2000){
var urlSpl = this.url.split('?');
req.open("POST",urlSpl[0],true);
req.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
req.send(urlSpl[1]);
} else {
req.open("GET", this.url, true);
req.send("");
}
}
}
function browserSniffer(){
if(navigator.userAgent.toLowerCase().indexOf("msie") != -1){
if(navigator.userAgent.toLowerCase().indexOf("6")){
return 8;
}else{
return 1;
}
}
if(navigator.userAgent.toLowerCase().indexOf("firefox") != -1){
return 2;
}
if(navigator.userAgent.toLowerCase().indexOf("opera") != -1){
return 3;
}
if(navigator.userAgent.toLowerCase().indexOf("safari") != -1){
return 4;
}
return 5;
}
当然,这是很老的代码,但它仍然是为我工作的网站上我几年前建成。 我与其他人同意,虽然我通常使用一个框架,现在让我不必再使用此代码或类似的东西。
您可以忽略一些与分割等细节的......在请求onreadystate功能。 它应该请求转换为后,如果它是超过一定的长度,但我决定它总是更好地做一个职位。
当内容类型是由浏览器错误检测,或者它无法正常发送,就会出现此问题居多。
它容易,只需将其覆盖:
var request = new XMLHttpRequest();
request.open("GET", url, false);
request.overrideMimeType("text/xml");
request.send(null);
return request.responseXML;
不知道为什么......只有Safari和Chrome出现此问题(WebKit浏览器,服务器正确地发送标题)。
你叫相对于当前文档的URL? 由于IE浏览器将使用ActiveXObject的,它可能需要一个绝对路径,例如:
HTTP://some.url/ConferenceRoomSchedules.xml
对于XML,你确定它的良好形成的呢? 它在XML编辑器加载,例如?
我可以建议你的是看看那个隐藏的框架,并为您管理这些跨浏览器问题(以可靠的方式)。 这里的一个好点的是jQuery的 。 做这些事情,自己可能会变得非常困难和复杂。
这可能是你所需要的。
//编辑:这是怎么w3school显示它:
function ajaxFunction()
{
var xmlhttp;
if (window.XMLHttpRequest)
{
// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else if (window.ActiveXObject)
{
// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
else
{
alert("Your browser does not support XMLHTTP!");
}
}
为了避免您的跨浏览器的问题(并保存自己的编码很多,一个强大的社区已经开发,测试和审查的项目),你应该选择一个JavaScript库。 jQuery和道场是很好的选择。
我相信,你的Web服务器要为正确的响应头与“ConferenceRoomSchedules.xml”如内容类型:文本/ xml或任何其他XML类型。
由阿隆所提供的答案https://stackoverflow.com/a/2081466/657416是从我的角度最简单的(最好的)一个点。 这是我工作的代码:
ajax = ajaxRequest();
ajax.overrideMimeType("text/xml");
ajax.open("GET", myurl;