使用 jQuery 排序选择框 [英] Sorting Select box with jQuery

问题描述

我在表单上有一个选择框，它带有一个增量 rel 属性.我有一个函数可以按 .text() 值对选项进行排序，按字母顺序排列.

I have a select box on a form, which carries an incremental rel attribute. I have a function that can sort the options by thier .text() value, into alphabetcal order.

我的问题是，使用 jQuery，我如何使用 rel 属性按升序排序?

My question is, with jQuery, how do i sort in an ascending order using the rel attribute ?

<option rel="1" value="ASHCHRC">Ashchurch for Tewkesbury </option>
<option rel="2" value="EVESHAM">Evesham </option>
<option rel="3" value="CHLTNHM">Cheltenham Spa </option>
<option rel="4" value="PERSHOR">Pershore </option>
<option rel="5" value="HONYBRN">Honeybourne </option>
<option rel="6" value="MINMARS">Moreton-in-Marsh </option>
<option rel="7" value="GLOSTER">Gloucester </option>
<option rel="8" value="GTMLVRN">Great Malvern </option>
<option rel="9" value="MLVRNLK">Malvern Link </option>

我的排序函数:var object；可以是整个表单中的众多选择框之一.

my sort function: var object; can be one of many select boxes throughout the form.

$(object).each(function() {

    // Keep track of the selected option.
    var selectedValue = $(this).val();

    // sort it out
    $(this).html($("option", $(this)).sort(function(a, b) { 
        return a.text == b.text ? 0 : a.text < b.text ? -1 : 1 
    }));

    // Select one option.
    $(this).val(selectedValue);

});

推荐答案

如果你想按 rel 排序，你应该改变你的函数

If you want to sort by rel you should change your function

$(this).html($("option", $(this)).sort(function(a, b) { 
    var arel = $(a).attr('rel');
    var brel = $(b).attr('rel');
    return arel == brel ? 0 : arel < brel ? -1 : 1 
}));

使用 parseInt() 进行编辑

edit with parseInt()

$(this).html($("option", $(this)).sort(function(a, b) { 
    var arel = parseInt($(a).attr('rel'), 10);
    var brel = parseInt($(b).attr('rel'), 10);
    return arel == brel ? 0 : arel < brel ? -1 : 1 
}));

这篇关于使用 jQuery 排序选择框的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！