JQuery UI Sortable表格行排序问题：固定Order列值不变

首先，你当前代码的核心问题是items选择器错误：你设置的是'td:not(:nth-child(3))'，但Sortable需要作用在表格的<tr>元素上（实现整行拖动），而非单个<td>单元格。

正确实现方案： #

1. 初始化Sortable并保存初始Order值
   修改Sortable配置，确保拖动整行，同时提前保存初始的Order列数值，拖动结束后重置该列顺序：

   $(function() {
       // 保存初始的Order列数值数组
       const initialOrders = $("#sortable tr").map(function() {
           return $(this).find("td:nth-child(3)").text();
       }).get();
   
       $("#sortable").sortable({
           items: 'tr', // 指定拖动对象为整行
           cursor: 'move',
           stop: function() {
               // 拖动结束后，按初始顺序重置Order列
               $("#sortable tr").each(function(index) {
                   // 由于使用Knockout数据绑定，需更新对应ViewModel属性
                   const fruit = ko.dataFor(this);
                   fruit.order(initialOrders[index]);
               });
           }
       }).disableSelection();
   });
   

2. 关键细节说明

   • 提前保存initialOrders数组，确保拖动后能恢复固定的Order序列（比如你示例中的5、10、15）。
   • 因为表格使用了Knockout的data-bind，直接修改DOM文本会被数据绑定覆盖，所以必须通过ko.dataFor()获取行对应的ViewModel对象，更新order属性。

原代码无效的原因 #

你之前指定items为单个单元格，导致只能拖动单元格而非整行，既不符合整行排序的需求，也无法实现Order列保持固定顺序的逻辑。

内容的提问来源于stack exchange，提问作者Lindsay