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解决了，谢谢
标签：

相关文章