jquery - リスト項目数の追加 jQuery

Question

これを使用して、複数の選択ボックスの値に応じてリストを作成しています。

$(document).ready(function() {
    $("select").change(function() { // <-- bind change event handler to the drop downs
        var sel = "";
        $(".option-select option:selected").each(function() { // <-- then iterate each time it changes   
            if ($(this).index() !== 0) { // <-- only if not default
                sel += "<li>" + $(this).text() + "</li>";
            }
            $("ul.result ul").empty().append(sel); //<-- empty() to remove old list and update with new list
        });
    });
});

ただし、リストに追加されたオプションの数、または値が選択された選択ボックスの数を出力する方法がわかりません。ユーザーが選択したオプションの数を、既に持っているようにそれらのオプションを表示するとともに、ユーザーに伝える必要があります。次を使用して、リスト内のアイテムの数を数える方法を見つけました。

var count = $("ul li").length;

しかし、このカウントを出力する方法がわかりません。

score 0 · Accepted Answer

このようなものが欲しいかもしれません

$(document).ready(function() {
    $("select").change(function() {
        var list=$(this).children(':selected').not($(this).children()[0]);
        $('#result, #count').empty();
        if(list.length){
            list.each(function(){
                $('<li></li>').val($(this).val()).text($(this).text())
                .appendTo($('#result'));
                $('#count').html(list.length);
            });
        }
    });
});

デモ。

score 0 · Accepted Answer

このようにできました

    $(document).ready(function() {
    $("select").change(function() { // <-- bind change event handler to the drop downs
        var sel = "";
        var counter = 0;
        $(".option-select option:selected").each(function() { // <-- then iterate each time it changes   
            if ($(this).index() !== 0) { // <-- only if not default
            {
                sel += "<li>" + $(this).text() + "</li>";
                counter++;
            }
            }    
            $("ul.result ul").empty().append(sel); //<-- empty() to remove old list and update with new list
        });
    });

//The Number of Option's Added
counter;

または、enter code heresel を Jqueryに変換するだけです

$(sel).length;

score 0 · Accepted Answer

要素を作成し、そこに値を入れます。次のようになります。

<div id="count_holder">You have <span></span> options</div>
<script>
    $("#count_holder").find("span").text(count);
</script>

jquery - リスト項目数の追加 jQuery

3 に答える 3

Related

Reference