在 jQuery 中使用输入框对动态表进行排序

Sorting Dynamic Tables With Input Boxes in jQuery

本文关键字:动态 排序 jQuery 输入      更新时间:2023-09-26

我已经演示了我在jsFiddle中尝试做的事情:http://jsfiddle.net/clowerweb/SbNdb/

只需单击表格标题即可排序(您可能需要单击多次!

所以我这里有一个动态表格,用于添加和删除可以拥有可变数量条目的比赛参赛者(最终它也将被保存,并随机选择一个获胜者)。

我认为输入参赛者的用户可能也希望能够按字母顺序或按条目数量对列表进行排序。我在SO上找到了一个不错的表排序器脚本,并将其添加到我的jQuery函数中。

问题是,它似乎没有读取输入值。它将双向反转表的顺序并将其恢复为默认值,但实际上不会按输入值对它们进行排序

这可能是以下两个问题之一:

  1. 最有可能的是它根本没有读取输入值。
  2. 它也无法实际看到动态添加的行(虽然看起来它在点击时循环浏览表格,所以我不要怀疑这是问题所在。

任何帮助都非常感谢,谢谢!

您在comparator function中得到的是 td ,因此要根据input进行排序,您需要在该td中搜索它们并与text field's values进行比较。所以比较器功能看起来像

function(a, b) {                
   return $(a).find('input').val() > $(b).find('input').val() ?
                 inverse ? -1 : 1
                : inverse ? 1 : -1;
}

工作小提琴