Question

我正在尝试编写一个简单的函数来在javascript中从XML加载数组。在调用success:时，我已成功地使用$.ajax(...)字段将AJAX结果发送到函数。

另外，我注意到函数$.ajax(...)的返回值是Object，其中包含字段responseText和responseXML（我很乐意使用）。但是，即使我可以在控制台上的树中看到它们，尝试通过.responseText访问它们也不起作用（因此打印undefined，如果我尝试查找一些垃圾字符串也一样.this_does_not_exist）。

我将使用几个不同的XML文件几乎完全相同，我想用代码来做。我不满足于简单地让success:参数将结果踢到单独的函数的原因是因为我可能多次使用数据，但只想加载一次。我正在尝试分离加载和使用XML，以便它不会多次加载。

您能告诉我为什么responseText在我输出xml_ret时出现，但xml_ret.responseText无法访问？

非常感谢您的帮助和耐心。

注意：从同一目录加载test.xml，您需要以这种方式启动Chrome或Chromium：

chromium-browser --allow-file-access-from-files

的test.html：

<html>
<head>
<script type="text/javascript" 
        src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>

    <script type="text/javascript">
      function print_XML(xml)
      {
      console.log( "in printXML" );
      console.log(xml);

      $(xml).find("point").each(function()
      {
      var loaded_row = [ parseInt($(this).attr("number_protein_groups")), parseInt( $(this).attr("log_likelihood") ) ];
      console.log( loaded_row );
      });
      }

      function load_and_print_XML(fname)
      {
    console.log( "in load_and_print_XML" );

      xml_ret = $.ajax({
      type: "GET",
      url: fname,
      dataType: "xml",
      success: print_XML
       });

    console.log( "xml_ret" );
    console.log( xml_ret );
    console.log( xml_ret.responseText );
      }

    </script>

</head>
  <body>
    <script type="text/javascript">
      xml_data = load_and_print_XML("test.xml");
      /* do something with xml_data here */
    </script>
  </body>
</html>

的test.xml

<?xml version="1.0" encoding="utf-8" ?>
<results>
  <replicate_result graph_filename="yeast_1.pivdo">
    <point number_protein_groups="10" log_likelihood="20"/>
    <point number_protein_groups="20" log_likelihood="40"/>
    <point number_protein_groups="40" log_likelihood="60"/>
    <point number_protein_groups="50" log_likelihood="50"/>
    <point number_protein_groups="60" log_likelihood="55"/>
  </replicate_result>
</results>

我的控制台：

in load_and_print_XML
test.html:30xml_ret
test.html:31
Object
abort: function (a){a=a||"abort",p&&p.abort(a),w(0,a);return this}
always: function (){i.done.apply(i,arguments).fail.apply(i,arguments);return this}
complete: function (){if(c){var a=c.length;n(arguments),j?l=c.length:e&&e!==!0&&(k=a,o(e[0],e[1]))}return this}
done: function (){if(c){var a=c.length;n(arguments),j?l=c.length:e&&e!==!0&&(k=a,o(e[0],e[1]))}return this}
error: function (){if(c){var a=c.length;n(arguments),j?l=c.length:e&&e!==!0&&(k=a,o(e[0],e[1]))}return this}
fail: function (){if(c){var a=c.length;n(arguments),j?l=c.length:e&&e!==!0&&(k=a,o(e[0],e[1]))}return this}
getAllResponseHeaders: function (){return s===2?n:null}
getResponseHeader: function (a){var c;if(s===2){if(!o){o={};while(c=bG.exec(n))o[c[1].toLowerCase()]=c[2]}c=o[a.toLowerCase()]}return c===b?null:c}
isRejected: function (){return!!i}
isResolved: function (){return!!i}
overrideMimeType: function (a){s||(d.mimeType=a);return this}
pipe: function (a,b,c){return f.Deferred(function(d){f.each({done:[a,"resolve"],fail:[b,"reject"],progress:[c,"notify"]},function(a,b){var c=b[0],e=b[1],g;f.isFunction(c)?i[a](function(){g=c.apply(this,arguments),g&&f.isFunction(g.promise)?g.promise().then(d.resolve,d.reject,d.notify):d[e+"With"](this===i?d:this,[g])}):i[a](d[e])})}).promise()}
progress: function (){if(c){var a=c.length;n(arguments),j?l=c.length:e&&e!==!0&&(k=a,o(e[0],e[1]))}return this}
promise: function (a){if(a==null)a=h;else for(var b in h)a[b]=h[b];return a}
readyState: 4
responseText: "<?xml version="1.0" encoding="utf-8" ?>↵<results>↵  <replicate_result graph_filename="yeast_1.pivdo">↵    <point number_protein_groups="10" log_likelihood="20"/>↵    <point number_protein_groups="20" log_likelihood="40"/>↵    <point number_protein_groups="40" log_likelihood="60"/>↵    <point number_protein_groups="50" log_likelihood="50"/>↵    <point number_protein_groups="60" log_likelihood="55"/>↵  </replicate_result>↵</results>"
responseXML: Document
setRequestHeader: function (a,b){if(!s){var c=a.toLowerCase();a=m[c]=m[c]||a,l[a]=b}return this}
state: function (){return e}
status: 200
statusCode: function (a){if(a){var b;if(s<2)for(b in a)j[b]=[j[b],a[b]];else b=a[v.status],v.then(b,b)}return this}
statusText: "success"
success: function (){if(c){var a=c.length;n(arguments),j?l=c.length:e&&e!==!0&&(k=a,o(e[0],e[1]))}return this}
then: function (a,b,c){i.done(a).fail(b).progress(c);return this}
__proto__: Object
test.html:32undefined
test.html:9in printXML
test.html:10
Document
<results>
<replicate_result graph_filename="yeast_1.pivdo">…</replicate_result>
</results>
test.html:15[10, 20]
test.html:15[20, 40]
test.html:15[40, 60]
test.html:15[50, 50]
test.html:15[60, 55]

Answer 1

问题：

你能告诉我为什么在输出xml_ret时会显示responseText，但是无法访问它 xml_ret.responseText？

这种情况正在发生，因为当你执行一个对象的console.log时，例如在chrome中，它会保留对控制台中对象的引用。如果对象发生变化，那些变化将由chrome的控制台反映出来。

所以当你这样做时会发生什么：

console.log( "xml_ret" );
console.log( xml_ret );
console.log( xml_ret.responseText );

ajax请求尚未完成且仍未分配responseText，这就是为什么它显示为未定义的原因。但是，打印的xml_ret对象是对象的引用，所以当ajax请求完成时，如果你去检查控制台上的值，它有一个“responseText”属性，因为它已经被设置了。

您可以看到，如果您调试代码并在此行中添加断点：

console.log( xml_ret.responseText );

查看文件xml_ret时，它没有“responseText”属性。

PS：我肯定需要审核此评论。太晚了也认为：P

Answer 2

问题是控制台会更新对象，如果它们得到更新但不是字符串的。

因此，如果你调用ajax调用，函数将直接返回一个对象，但responseText将是未定义的，因为调用尚未完成。

因此，如果你想使用responseText，你应该成功：

function print_XML(xml, s, jqXHR) { // there are 3 arguments past the third one is the same as the return of $.ajax
    console.log( "in printXML" );
    console.log(xml);

    $(xml).find("point").each(function()
    {
    var loaded_row = [ parseInt($(this).attr("number_protein_groups")), parseInt( $(this).attr("log_likelihood") ) ];
    console.log( loaded_row );
    });

    console.log(jqXHR);
    console.log(jqXHR.responseText); // now it works!
}

Answer 3

输出xml_ret时会出现

responseText，因为这是ajax函数在jQuery中的工作方式。这是回调中返回的内容

成功（data，textStatus，jqXHR）

因此，当您尝试获取xml_ret的属性时，它会失败，因为它只是XML数据而不是对象。第三个参数是你所期望的，它也稍微被修改，因为它是一个jquery。

使用AJAX加载和返回数据以便以后使用

3 个答案: