如何逐行依次执行Ajax请求更新表格行状态？

嘿，这个问题我太懂了！你之前用each加setInterval的写法，相当于页面加载时给300多行都挂了个1秒后触发的定时器，时间一到所有请求几乎同时冲出去，浏览器和服务器都顶不住，不卡顿才怪呢😅。给你两个简便靠谱的逐行执行方案：

方案一：递归函数（兼容性好，适合所有环境） #

这个思路很直接：先把所有行存起来，然后写一个递归函数，每次只处理当前行，等Ajax请求成功（或失败）后，再调用自己处理下一行，完全串行执行，不会同时堆请求。

// 先把所有表格行转换成数组，方便按顺序处理
const rows = $('table tbody tr').toArray();
let currentRowIndex = 0;

function processNextRow() {
  // 终止条件：所有行都处理完了
  if (currentRowIndex >= rows.length) {
    console.log('所有行的状态更新都完成啦！');
    return;
  }

  const currentRow = rows[currentRowIndex];
  const rowId = currentRow.id; // 获取当前行的row_id

  $.ajax({
    url: '你的接口地址', // 替换成实际的接口URL
    method: 'POST', // 接口请求方式，GET/POST根据实际情况调整
    data: { row_id: rowId }, // 传递row_id给后端
    success: function(response) {
      // 请求成功后，把响应内容追加到当前行的目标列里
      $(currentRow).find('td:last').append(response);
      // 处理完当前行，索引加1，继续下一行
      currentRowIndex++;
      processNextRow();
    },
    error: function(xhr, status, error) {
      // 请求失败的处理：可以打印错误，然后继续下一行
      console.error(`处理ID为${rowId}的行失败：`, error);
      currentRowIndex++;
      processNextRow();
    }
  });
}

// 启动逐行处理
processNextRow();

方案二：Async/Await（现代JS风格，逻辑更清晰） #

如果你的项目支持ES6+语法，用async/await会让代码更易读，本质也是串行执行，每一个请求完成后才会处理下一行：

async function processAllRows() {
  const rows = $('table tbody tr').toArray();
  
  // 用for...of循环逐行处理，await会等待当前请求完成
  for (const row of rows) {
    const rowId = row.id;
    try {
      // 等待Ajax请求完成，拿到响应
      const response = await $.ajax({
        url: '你的接口地址',
        method: 'POST',
        data: { row_id: rowId }
      });
      // 追加响应内容到目标列
      $(row).find('td:last').append(response);
      
      // 可选：如果担心请求太频繁给服务器压力，可以加个短延迟
      await new Promise(resolve => setTimeout(resolve, 300));
    } catch (error) {
      // 捕获错误，避免整个流程中断
      console.error(`处理ID为${rowId}的行失败：`, error);
    }
  }
  
  console.log('全部行处理完成！');
}

// 启动处理
processAllRows();

为啥之前的写法会卡顿？ #

你原来的代码里，$('table tbody tr').each()会立刻遍历所有行，给每一行都设置了一个setInterval，1秒后所有请求会同时发起。浏览器对同一域名的并发请求数是有限制的（一般是6个左右），剩下的请求会排队等待，300多个请求堆在一起，浏览器资源被占满，自然就卡顿了。

内容的提问来源于stack exchange，提问作者Muhammad Hashir Anwaar