javascript - 使用 jquery then() 打印 html 和 json 结果

标签 javascript jquery json jquery-deferred

我正在尝试学习使用 jquery deferreds。

当在jsfiddle上使用html时,我得到一个返回的对象,当在then()语句中打印时,它有两行:“success”和ajax请求返回的html。

所以当我这样做时:

$(document).on('click', '.ajax', function() {
    $.when(ajax1('<p>first</p>'), 
           ajax2('<p>second</p>'), 
           ajax3('<p>third</p>'))
     .then(function(results1, results2, results3) {
        console.log(results1);
        $('.document').append(results1);
        $('.document').append(results2); 
        $('.document').append(results3);         
        alert('all ajax done');
    });
});

http://jsfiddle.net/loren_hibbard/AsgDz/

我在控制台中得到这个:

["<p>first</p>", "success", 
Object
     abort: function ( statusText ) {
     always: function () {
     complete: function () {
     done: function () {
     error: function () {
     fail: function () {
     getAllResponseHeaders: function () {
     getResponseHeader: function ( key ) {
     overrideMimeType: function ( type ) {
     pipe: function ( /* fnDone, fnFail, fnProgress */ ) {
     progress: function () {
     promise: function ( obj ) {
     readyState: 4
     responseText: "<p>first</p>"
     setRequestHeader: function ( name, value ) {
     state: function () {
     status: 200
     statusCode: function ( map ) {
     statusText: "OK"
     success: function () {
     then: function ( /* fnDone, fnFail, fnProgress */ ) {
          __proto__: Object

如何访问该 responseText 并避免每隔一行显示“成功”的 html 输出:

first
success
second
success
third
success

由于我更有可能将其与 JSON 数据一起使用,因此我该如何解析它。现在,虽然它在我的 then() 函数中返回“ajax all Complete”,但控制台中返回的对象是一组三个对象。一个是解析后的 json 字符串,另一个是烦人的字符串,表示“成功”,第三个是大对象,其中包含responseText,它是我未解析的 JSON 对象。如何访问第一个对象并打印解析后的字符串? http://jsfiddle.net/loren_hibbard/jtvHf/1/

谢谢!

最佳答案

简单修复 - 每个结果对象都是一个包含三个项目的数组:

  1. 结果数据
  2. 状态字符串(“成功”)
  3. JQXHR 对象。

因此只需使用results1[0]等即可获取数据:

 $('.document').append(results1[0].JSON);

DEMO

<小时/>

(请注意,您的 ajax3 函数中似乎也存在拼写错误 - “type”被设置为 html 而不是“post”。)

关于javascript - 使用 jquery then() 打印 html 和 json 结果,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/13423270/

相关文章:

javascript - 检查JSON的Key

javascript - 如何重置 Mathjax 范围 ID

javascript - 使用 vanilla javascript 获取 json 格式的 php

javascript - 如何将数组传递给java servlet

javascript - 如何使用多嵌套 json 值修补响应式(Reactive)表单

javascript - 谁在调用该函数?

jquery - 不懂jquery连接?

javascript - Rails3中动态更新html页面

javascript - 在 vue 应用程序中使用 javascript 重写 jQuery 禁用按钮

ios - 在 Swift 中使用动态键解析 JSON