1

我正在使用以下 jQuery 对表单中的选择元素进行排序：

$('select.select-sortable').each(function () {
    var options = $(this).children();
    var arr = options.map(function(_, o) { return { t: $(o).text(), v: o.value }; }).get();
    arr.sort(function(o1, o2) { return o1.t > o2.t ? 1 : o1.t < o2.t ? -1 : 0; });
    options.each(function(i, o) {
      o.value = arr[i].v;
      $(o).text(arr[i].t);
    });
});

排序有效，但显示的值会在每次页面刷新时发生变化。无论存在多少选项，它都会按照第 1 选项 -> 第 3 选项 -> 第 2 选项 -> 第 1 选项的顺序变化。

我已经添加$(this).children(":first").attr("selected", true);到循环中，它将选择锁定到第一个选项，但我仍然不明白为什么 dsiplay 会发生变化，以及为什么按这个顺序。有没有人有任何想法？

4

3 回答 3

1

问题主要是因为selected未捕获选项的属性。 

$('select').each(function () {
    var options = $(this).children();
    var arr = options.map(function(_, o) {
      return { t: $(o).text(), v: o.value, s: $(o).attr('selected') };
    }).get();
    arr.sort(function(o1, o2) { return o1.t > o2.t ? 1 : o1.t < o2.t ? -1 : 0; });
    options.each(function(i, o) {
      o.value = arr[i].v;
      $(o).text(arr[i].t);
      if(arr[i].s!==undefined){
        $(o).attr('selected','selected');
      }
    });
});
于 2013-08-01T16:05:26.777 回答
0

试试下面的代码，它会排序并选择你将传入 .eq() 的值

var arr = [],
$select = $("#ddsort"),
$options = $select.children();

$options.each(function(index, obj){
   arr.push($(this).val());
});

Array.sort(arr);
$select.empty();

$.each(arr,function(index, obj){
   $select.append("<option value="+obj+">"+obj+"</option>");   
});

$select.children().eq(2).attr("selected","selected");

请参阅此处的工作示例：http: //jsfiddle.net/tFDNx/3/

我希望它有所帮助。

于 2013-08-01T16:27:08.600 回答
0

这是因为浏览器缓存而发生的。它存储有关在按下重新加载之前选择了哪个选项（具有什么值）的信息。如果您即时更改选项值，浏览器将在下次重新加载时反映这些更改，但您的脚本将立即再次修改这些值。它正在追赶你:)

顺便提一句。你不必做这样的结构：$(this).children(":first").attr("selected", true);简单options[0].selected = true;地放在options.each循环之后就足够了。

于 2013-08-01T19:20:53.930 回答