如何将自定义参数传递到 jQuery AJAX 方法的回调方法中？

Question

我看过这个问题的各种答案，但我无法将它们映射到我的情况。我认为可能是其中一些的答案，似乎是旧的编码方式或对我来说不够熟悉以至于我无法理解如何根据我的情况实施它们。

我已经 PHP 生成了一个 records.json 文件，我的应用程序需要在该文件中查询多个方法的逻辑。

function queryRecords(recordId, requiredField) {
    $.ajax("javascript/records.json", {
        dataType: "json",
        success: callBack,
        error: function (jqXhr, textStatus, errorMessage) {
            alert("AJAX error: unable to retrieve records from records.json\n\n" + errorMessage);
        }
    });
}

function callBack(response) {
    $.each(response, function(index, records) {
        if (records["MediaItemID"] == recordId) {
            $.each(records, function(key, value) {
                if (key == requiredField) {
                    return value;
                }
            });
        }
    });
}

queryRecords("14", "MediaItemName");

每次我需要查询记录时，我需要通过 recordId 和 requiredField 来获取该记录字段的值（根据 callBack 方法中的循环）。然而，我似乎对这种方法有限制，因为我无法将这些值作为参数传递给 success。如果我输出到控制台 within success，我会看到该值，但我需要访问成功之外的值，这就是我的距离得到了。我看了很多关于这个的页面，我的头很痛。请问你能帮忙吗？

Answer 1

试一试，

function queryRecords(recordId, requiredField) {
  return new Promise((resolve, reject) => {
      $.ajax("javascript/records.json", {
        dataType: "json",
        success: function (response) {
          resolve(callBack(recordId, requiredField, response));
        },
        error: function (jqXhr, textStatus, errorMessage) {
            reject(errorMessage);
        }
    });
  });
}

function callBack(recordId, requiredField, response) {
  $.each(response, function(index, records) {
      if (records["MediaItemID"] == recordId) {
          $.each(records, function(key, value) {
              if (key == requiredField) {
                  return value;
              }
          });
      }
  });
}
queryRecords("14", "MediaItemName").then(response => {
  // response will contain your return value
}).catch(errorMessage => {
  alert("AJAX error: unable to retrieve records from records.json\n\n" + errorMessage);
});

示例实现，

function queryRecords(userId) {

      return new Promise((resolve, reject) => {
          $.ajax("https://jsonplaceholder.typicode.com/todos", {
            dataType: "json",
            success: function (response) {
              resolve(callBack(userId, response));
            },
            error: function (jqXhr, textStatus, errorMessage) {
                reject(errorMessage);
            }
        });
      });
    }

    function callBack(userId, response) {
      let filteredTodos = [];
      $.each(response, function(index, todo) {
          if (todo.userId == userId) {
              filteredTodos.push(todo);
          }
      });
      return filteredTodos;
    }
           
    queryRecords(1).then(filteredTodos => {
      alert(filteredTodos);
    }).catch(errorMessage => {
      alert("AJAX error: unable to retrieve records from records.json\n\n" + errorMessage);
    });

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

Answer 2

我测试了 https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/async_function 中建议的代码，只是为了看看我是否可以访问 Promise 之外的值，但它失败了，因为它一直在做...

var xyz = "please";

function resolveAfter2Seconds() {
  return new Promise(resolve => {
    setTimeout(() => {
      resolve('resolved');
    }, 2000);
  });
}

async function asyncCall() {
  console.log('calling');
  const result = await resolveAfter2Seconds();
  xyz = result;
  //console.log(result);
  // expected output: "resolved"
}

asyncCall();

console.log(xyz);

它returns 'please'.

要么我不理解所提供的解决方案，要么我试图实现的目标没有被理解。我很高兴接受这是一个“我”的问题。

如果只是在 ajax 查询中将 async 设置为 false，答案会很简单，但不推荐这样做。

答案是：我放弃了，但这只是因为多个方法依赖多个 ajax 逻辑调用可能是不明智的。

因此，我打算将 json 文件中的记录导入到一个数组中，这样我就可以随时访问数据而不会头疼。

如何将自定义参数传递到 jQuery AJAX 方法的回调方法中？

How do I pass custom parameters into the callback method of a jQuery AJAX method?

parameters

ajax

jquery

callback