如何使用JQuery + JEditable一次编辑/保存多个字段？

<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-jeditable/1.7.3/jquery.jeditable.min.js"></script>

<table>
  <tr>
    <td><span class="editable" data-field="name">John Doe</span></td>
    <td><span class="editable" data-field="age">25</span></td>
  </tr>
  <tr>
    <td><span class="editable" data-field="name">Jane Smith</span></td>
    <td><span class="editable" data-field="age">30</span></td>
  </tr>
</table>

$(document).ready(function() {
  $('.editable').editable('save.php', {
    type: 'POST',
    submit: '保存',
    cancel: '取消',
    tooltip: '点击编辑',
    event: 'dblclick',
    callback: function(value, settings) {
      // 编辑保存后的回调函数
      console.log(value);
    }
  });
});

<?php
$field = $_POST['field']; // 编辑的字段名
$value = $_POST['value']; // 编辑后的值

// 处理和保存数据的逻辑

echo $value; // 返回保存后的值
?>