ajax怎么把数据保存在一个数组中然后获取

时间:2022-04-09 19:02:18
var Cache={
arrays: new Array(),
data: function(){
var xmlhttp=createAjax();
xmlhttp.open("GET","s.jsp",true);
xmlhttp.onreadystatechange=function(){
if(xmlhttp.readyState==4){
if(xmlhttp.status==200){
var xmlData=xmlhttp.responseXML;
var title=xmlData.getElementsByTagName("title");
if(title==null) return;
for(var i=0;i<title.length;i++){
Cache.arrays.push(title[i].firstChild.nodeValue);
}
//alert(Cache.arrays);
}
else{
alert(xmlhttp.status);
}
}
};
xmlhttp.setRequestHeader("If-Modified-Since","0");
xmlhttp.send(null);
},
getData: function(){
alert(Cache.arrays);
}
};
首先建立一个类,然后保存在属性arrays里面,再用getData返回数组的数据,现在问题是getData时数组的数据还是为空,可能是回调函数还没有执行,怎么确保回调函数执行了getDate方法可以返回一个有数据的数组呢,比如我可以在外部用var a=Cache.getData()获取到ajax返回的数据,求教?谢谢

11 个解决方案

#1


有没有人知道啊

#2


返回的数组为空,不一定就是JS代码问题,也许是你后台根本没有输出正确XML数据!认真检查下JSP后台输出的XML是否有问题!

先不用后台JSP文件。直接建立一个XML试试是否有结果!

#3


我的测试代码如下:
HTML代码:


<html>  
<head>  
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>jquery xml解析</title>  

<script type="text/javascript">
var Cache={
arrays: new Array(),
createAjax:function(){
 if(window.XMLHttpRequest)
  {return new XMLHttpRequest();}
  else
  {return new  ActiveXObject("Microsoft.XMLHttp");}
},
data: function(){
Cache.xmlhttp=Cache.createAjax();
//alert(xmlhttp);
Cache.xmlhttp.open("GET","xml.xml",false);
Cache.xmlhttp.send();
Cache.xmlhttp.onreadystatechange=Cache.callback();

},
callback:function(){
    if(Cache.xmlhttp.readyState==4 || Cache.xmlhttp.status==200){
      var xmlData=Cache.xmlhttp.responseXML;
       //alert(xmlData);
        var title=xmlData.getElementsByTagName("title");
       for(var i=0;i<title.length;i++){
     //Cache.arrays.push(title[i].firstChild.nodeValue);
  Cache.arrays.push(title[i].childNodes[1].firstChild.nodeValue);
  Cache.arrays.push(title[i].childNodes[3].firstChild.nodeValue);
                                   }
                                                 }
      else{
       alert(Cache.xmlhttp.status);
       }
 },
getData: function(){
alert(Cache.arrays.join("\n"));
}
};
Cache.data();
var a=Cache.getData()
</script>
</head>
<body>
</body>
</html>


XML文件为:

<?xml version="1.0" encoding="utf-8"?>
<book>
   <title>
      <csdn>CSDN</csdn>
      <book>JS书籍</book>
   </title>
   <title>
      <csdn>CSDN2</csdn>
      <book>JS书籍2</book>
   </title>
   <title>
      <csdn>CSDN3</csdn>
      <book>JS书籍3</book>
   </title>
</book>


2个文件都用记事本改为UTF-8编码!如果测试OK。说明JS代码没问题,核心还是后台部分输出的XML是否有问题!

#4


引用 3 楼 falizixun2 的回复:
我的测试代码如下:
HTML代码:


HTML code

<html>  
<head>  
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>jquery xml解析</title>  

<script type="text/javascript">
var Cac……

谢谢你的回答,我确定返回的后台数据是有数据的,对于你的答案我会好好看看,并查找问题之所在,谢谢

#5


这样的结构的写法不太好不过现在不讨论这个

var Cache={
arrays: new Array(),
state:0
data: function(){
Cache.state=0;
var xmlhttp=createAjax();
。。。
callback:function(){
    if(Cache.xmlhttp.readyState==4 || Cache.xmlhttp.status==200){
      var xmlData=Cache.xmlhttp.responseXML;
       //alert(xmlData);
        var title=xmlData.getElementsByTagName("title");
       for(var i=0;i<title.length;i++){
     //Cache.arrays.push(title[i].firstChild.nodeValue);
      Cache.arrays.push(title[i].childNodes[1].firstChild.nodeValue);
      Cache.arrays.push(title[i].childNodes[3].firstChild.nodeValue);
      Cache.state=1
                                   }
                                                 }
      else{
       alert(Cache.xmlhttp.status);
       }
 }
,getData: function(){
     alert(Cache.state?'还没有获取数据':Cache.arrays);
}
};

#6


引用 5 楼 kk3k2005 的回复:
这样的结构的写法不太好不过现在不讨论这个

var Cache={
arrays: new Array(),
state:0
data: function(){
Cache.state=0;
var xmlhttp=createAjax();
。。。
callback:function(){
    if(Cache.xmlhttp.readyState==4 || Cach……

     呵呵,我也想写一个更好的结构,但是一切以楼主为准,用什么结构就用什么结构,我要是改得面目全非了。即使改得再好,我也是问非所答!核心不在这里!

#7


引用 4 楼 qingliuyan 的回复:
引用 3 楼 falizixun2 的回复:
我的测试代码如下:
HTML代码:


HTML code

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>jquery xml解析</title>

<script type="text/ja……

确定有数据不代表数据结构就一定是XMLDOM结构,返回来的数据你ALERT一下看看是不是XMLDOMDOCUMENT对象,如果是才能保证可以通过XML方法去解析,否则做什么都是无用功!

#8


         另外注意编码格式,尤其是有中文字符的时候,还要注意浏览器,JQUERY也不是万能的,有的时候浏览器就会出现怪异现象,换个测试能让你以更广视角去考虑问题,最后还要注意运行平台,有的人搞半天,结果发现没有在平台下运行,而是直接双击HTML文件打开来执行,这样永远也无法运行后台文件的。另外火狐的安全机制很高。注意看FIREBUG的错误提示,一个错误提示能帮你搞定不少问题!

#9


谢谢大家

#10


引用 6 楼 falizixun2 的回复:
引用 5 楼 kk3k2005 的回复:

这样的结构的写法不太好不过现在不讨论这个

var Cache={
arrays: new Array(),
state:0
data: function(){
Cache.state=0;
var xmlhttp=createAjax();
。。。
callback:function(){
if(Cache.xmlhttp.re……

对于集思广益的建议本人一向是很接受的

#11


引用 3 楼 falizixun2 的回复:
我的测试代码如下:
HTML代码:


HTML code

<html>  
<head>  
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>jquery xml解析</title>  

<script type="text/javascript">
var Cac……

谢谢你,按照你的方法问题解决了,就是Cache.xmlhttp.onreadystatechange=Cache.callback();这句在ie还有些问题,我用了return this解决了,谢谢

#1


有没有人知道啊

#2


返回的数组为空,不一定就是JS代码问题,也许是你后台根本没有输出正确XML数据!认真检查下JSP后台输出的XML是否有问题!

先不用后台JSP文件。直接建立一个XML试试是否有结果!

#3


我的测试代码如下:
HTML代码:


<html>  
<head>  
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>jquery xml解析</title>  

<script type="text/javascript">
var Cache={
arrays: new Array(),
createAjax:function(){
 if(window.XMLHttpRequest)
  {return new XMLHttpRequest();}
  else
  {return new  ActiveXObject("Microsoft.XMLHttp");}
},
data: function(){
Cache.xmlhttp=Cache.createAjax();
//alert(xmlhttp);
Cache.xmlhttp.open("GET","xml.xml",false);
Cache.xmlhttp.send();
Cache.xmlhttp.onreadystatechange=Cache.callback();

},
callback:function(){
    if(Cache.xmlhttp.readyState==4 || Cache.xmlhttp.status==200){
      var xmlData=Cache.xmlhttp.responseXML;
       //alert(xmlData);
        var title=xmlData.getElementsByTagName("title");
       for(var i=0;i<title.length;i++){
     //Cache.arrays.push(title[i].firstChild.nodeValue);
  Cache.arrays.push(title[i].childNodes[1].firstChild.nodeValue);
  Cache.arrays.push(title[i].childNodes[3].firstChild.nodeValue);
                                   }
                                                 }
      else{
       alert(Cache.xmlhttp.status);
       }
 },
getData: function(){
alert(Cache.arrays.join("\n"));
}
};
Cache.data();
var a=Cache.getData()
</script>
</head>
<body>
</body>
</html>


XML文件为:

<?xml version="1.0" encoding="utf-8"?>
<book>
   <title>
      <csdn>CSDN</csdn>
      <book>JS书籍</book>
   </title>
   <title>
      <csdn>CSDN2</csdn>
      <book>JS书籍2</book>
   </title>
   <title>
      <csdn>CSDN3</csdn>
      <book>JS书籍3</book>
   </title>
</book>


2个文件都用记事本改为UTF-8编码!如果测试OK。说明JS代码没问题,核心还是后台部分输出的XML是否有问题!

#4


引用 3 楼 falizixun2 的回复:
我的测试代码如下:
HTML代码:


HTML code

<html>  
<head>  
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>jquery xml解析</title>  

<script type="text/javascript">
var Cac……

谢谢你的回答,我确定返回的后台数据是有数据的,对于你的答案我会好好看看,并查找问题之所在,谢谢

#5


这样的结构的写法不太好不过现在不讨论这个

var Cache={
arrays: new Array(),
state:0
data: function(){
Cache.state=0;
var xmlhttp=createAjax();
。。。
callback:function(){
    if(Cache.xmlhttp.readyState==4 || Cache.xmlhttp.status==200){
      var xmlData=Cache.xmlhttp.responseXML;
       //alert(xmlData);
        var title=xmlData.getElementsByTagName("title");
       for(var i=0;i<title.length;i++){
     //Cache.arrays.push(title[i].firstChild.nodeValue);
      Cache.arrays.push(title[i].childNodes[1].firstChild.nodeValue);
      Cache.arrays.push(title[i].childNodes[3].firstChild.nodeValue);
      Cache.state=1
                                   }
                                                 }
      else{
       alert(Cache.xmlhttp.status);
       }
 }
,getData: function(){
     alert(Cache.state?'还没有获取数据':Cache.arrays);
}
};

#6


引用 5 楼 kk3k2005 的回复:
这样的结构的写法不太好不过现在不讨论这个

var Cache={
arrays: new Array(),
state:0
data: function(){
Cache.state=0;
var xmlhttp=createAjax();
。。。
callback:function(){
    if(Cache.xmlhttp.readyState==4 || Cach……

     呵呵,我也想写一个更好的结构,但是一切以楼主为准,用什么结构就用什么结构,我要是改得面目全非了。即使改得再好,我也是问非所答!核心不在这里!

#7


引用 4 楼 qingliuyan 的回复:
引用 3 楼 falizixun2 的回复:
我的测试代码如下:
HTML代码:


HTML code

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>jquery xml解析</title>

<script type="text/ja……

确定有数据不代表数据结构就一定是XMLDOM结构,返回来的数据你ALERT一下看看是不是XMLDOMDOCUMENT对象,如果是才能保证可以通过XML方法去解析,否则做什么都是无用功!

#8


         另外注意编码格式,尤其是有中文字符的时候,还要注意浏览器,JQUERY也不是万能的,有的时候浏览器就会出现怪异现象,换个测试能让你以更广视角去考虑问题,最后还要注意运行平台,有的人搞半天,结果发现没有在平台下运行,而是直接双击HTML文件打开来执行,这样永远也无法运行后台文件的。另外火狐的安全机制很高。注意看FIREBUG的错误提示,一个错误提示能帮你搞定不少问题!

#9


谢谢大家

#10


引用 6 楼 falizixun2 的回复:
引用 5 楼 kk3k2005 的回复:

这样的结构的写法不太好不过现在不讨论这个

var Cache={
arrays: new Array(),
state:0
data: function(){
Cache.state=0;
var xmlhttp=createAjax();
。。。
callback:function(){
if(Cache.xmlhttp.re……

对于集思广益的建议本人一向是很接受的

#11


引用 3 楼 falizixun2 的回复:
我的测试代码如下:
HTML代码:


HTML code

<html>  
<head>  
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>jquery xml解析</title>  

<script type="text/javascript">
var Cac……

谢谢你,按照你的方法问题解决了,就是Cache.xmlhttp.onreadystatechange=Cache.callback();这句在ie还有些问题,我用了return this解决了,谢谢