将 Ajax JQuery 选择器保存在数组中

Posted 2023-02-24

【中文标题】将 Ajax JQuery 选择器保存在数组中

【英文标题】：Save Ajax JQuery selector in an array

【发布时间】：2019-07-05 13:32:54

【问题描述】：

我是 Ajax 的新手，我需要帮助将 Ajax 请求中的数据存储到数组中。我在论坛上查看了答案，但我无法解决我的问题。Ajax 响应将进入$('#responseField').val(format(output.response))，我希望将“output.response”存储到可以在外部使用的数组中阿贾克斯。我试图在 Ajax 之外声明一个变量并稍后调用它，但没有成功。我正在使用应该获取数据的$json_arr。如何从 Ajax 获取数据并将其存储在要在 Ajax 外部使用的变量中？这个变量将是一个我可以访问索引的数组。

function sendRequest(postData, hasFile) 

  function format(resp) 
    try 
      var json = JSON.parse(resp);
      return JSON.stringify(json, null, '\t');
     catch(e) 
      return resp;
    
  

  var value; // grade item
  $.ajax(
          type: 'post',
          url: "doRequest.php",
          data: postData,
          success: function(data)  //data= retArr

            var output = ;

            if(data == '') 
              output.response = 'Success!';
             else 
              try 
                output = jQuery.parseJSON(data);


               catch(e) 
                output = "Unexpected non-JSON response from the server: " + data;
              
            
            $('#statusField').val(output.statusCode);
            $('#responseField').val(format(output.response));

            $("#responseField").removeClass('hidden');
            data = $.parseJSON(output.response)
            $json_arr=$('#responseField').val(format(output.response));
          ,
          error: function(jqXHR, textStatus, errorThrown) 
            $('#errorField1').removeClass('hidden');
            $("#errorField2").innerhtml = jqXHR.responseText;
          

  );



window.alert($json_arr);

【问题讨论】：

Wait until all jQuery Ajax requests are done?的可能重复

@Nick 为什么你将它标记为重复而不是重复？用户询问如何将数据从 ajax 返回到 javascript 内的全局范围，而不是如何等待多个 ajax 调用。

@Admir OPs 的问题是 window.alert($json_arr); 在 ajax 调用完成之前执行，因此 $json_arr 中没有数据。

How do I return the response from an asynchronous call?的可能重复

@Nick 我该如何解决？

【参考方案1】：

let promise = new Promise(function(resolve, reject) 
  $.ajax(
          type: 'post',
          url: "doRequest.php",
          data: postData,
          success: function(data)  //data= retArr

            var output = ;

            if(data == '') 
              output.response = 'Success!';
             else 
              try 
                output = jQuery.parseJSON(data);


               catch(e) 
                output = "Unexpected non-JSON response from the server: " + data;
              
            
            $('#statusField').val(output.statusCode);
            $('#responseField').val(format(output.response));

            $("#responseField").removeClass('hidden');
            data = $.parseJSON(output.response)
            resolve(format(output.response));
          ,
          error: function(jqXHR, textStatus, errorThrown) 
            $('#errorField1').removeClass('hidden');
            $("#errorField2").innerHTML = jqXHR.responseText;
          

  );
);
promise.then(
  function(result)  /* you can alert a successful result here */ ,
  function(error)  /* handle an error */ 
);

问题是您正在异步调用。

【参考方案2】：

您同步调用警报，但应该异步调用它。

一个小sn-p可以帮助你看出区别：

// $json_arr initialized with a string, to make it easier to see the difference
var $json_arr = 'Hello World!';

function sendRequest() 

  $.ajax(
    // dummy REST API endpoint
    url: "https://reqres.in/api/users",
    type: "POST",
    data: 
        name: "Alert from AJAX success",
        movies: ["I Love You Man", "Role Models"]
    ,
    success: function(response)
        console.log(response);
        $json_arr = response.name;
        // this window.alert will appear second
        window.alert($json_arr);
    
  );


sendRequest();
// this window.alert will appear first
window.alert($json_arr);

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