Question

我一直试图获得一个更有活力的解决方案，而不是单独命名所有下拉菜单，我相信我错过了选择船。我想做类似以下的事情：

$(function () {    
    // loop through all the lists
    $("select").each(function(){
       var myId = $(this).attr('id'); 
       sortDropDownListByText(myId);
    });

    // pass the Id to a function to sort
    function sortDropDownListByText(selectId) {     
        $(selectId).html($(selectId + " option").sort(function(a, b) {        
            return a.text == b.text ? 0 : a.text < b.text ? -1 : 1     
        }))  
    }
});

我的最终目标将是一个CSS类作为选择器，而不是所有，但我觉得这里的解决方案将为我提供我需要的东西。

Answer 1

如果您对一个小排序插件持开放态度，那么这个插件很不错tinysort并具有灵活的用法，如：

// sort by the element's text
$("ul#people>li").tsort();

// sort by a child's text
$("ul#people>li").tsort("span.surname");

// sort by the img element, order descending using the img's "alt" attribute
$("ul#people>li").tsort("img",{order:"desc",attr:"alt"});

此外，还有一篇博客文章同时讨论http://blog.pengoworks.com/index.cfm/2008/9/11/Sorting-DOM-elements-using-jQuery

Answer 2

以下解决了我的初步问题。 :)

$(document).ready(function () {
    $('select').each(function () {
       sortDropDownListByText(this);
    });
});

// pass the select object to a function to sort  
function sortDropDownListByText(selectObject) {
    $(selectObject).html($("option", selectObject).sort(function (a, b) {
        return a.text == b.text ? 0 : a.text < b.text ? -1 : 1;
    }));
}

对所有选定的下拉列表进行排序

2 个答案: