0

選択オプションに問題があります。さまざまな選択オプションをアルファベット順に並べ替える必要があります（テキストと auguali 値オプションを使用）。複数選択ではなく、単一のオプションに対してのみ機能するように見える興味深いスクリプトを見つけました。各選択をソートする方法はありますか? たとえば、クリックして順序を選択しますが、オプションが重なっています。

$('.button').click(function() {
    var options = $('select option');
    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) {
        console.log(i);
        o.value = arr[i].v;
        $(o).text(arr[i].t);
    });
});

jsfiddle

ありがとう

4

2 に答える 2

1

コードは DOM のすべてのオプションをソートしようとします。各選択を個別にソートする必要があります。

コードを関数に挿入し、選択ごとに一意の識別子を使用できます。実際の例を次に示します。

<!doctype html>
<html lang="it">
    <meta charset="utf-8" />
    <head>
         <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
        <script>
        $(function() {
            $('.button').click(function() {
            sortSelect('prima');
        })
        $('.button_2').click(function() {
            sortSelect('seconda');
        })

        function sortSelect( selectId ) {
            var options = $('select#'+selectId+' option');
            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) {
                console.log(i);
                o.value = arr[i].v;
                $(o).text(arr[i].t);
            });
        };
    });
    </script>
</head>
<body>
    <select id="prima">
        <option value="uno">uno</option>
        <option value="due">due</option>
        <option value="tre">tre</option>
    </select>
    <select id="seconda">
        <option value="uno">uno</option>
        <option value="due">due</option>
        <option value="tre">tre</option>
    </select>
    <button class="button">Ordina la prima select</button>
    <button class="button_2">Ordina la seconda select</button>
</body>

于 2013-06-11T09:46:53.343 に答える
0

そのようにして、すべての選択からすべてのオプションを取得します。これが、多くの重複がある理由です。

選択ごとに繰り返し、彼のオプションのみを並べ替える必要があります。

さらに、localeCompareを使用して 2 つの文字列を比較できます。

$('button#sort').click(function () {
    $('select').each(function () {
       var options = $(this).children('option');
        options.sort(function (optionA, optionB) {
            return optionA.value.localeCompare(optionB.value);
        });
        $(this).empty().append(options);
    });
});

jsフィドル

于 2013-06-11T09:44:55.380 に答える