11

順序付けられていないリストの子の数をカウントする単純な js スクリプトがあります。クラス「hiddenItem」のdivを含む子（li）をカウントしないように、スクリプトを変更しようとしています。ここにリストとjsがあります。

    <ul id="dlist" class="sortable">
        <li id="listItem_000002">
            <div>
                <div><a class="itemCollapse"></a>
                </div>Item 2</div>
        </li>
        <li id="listItem_000003">
            <div>
                <div><a class="itemCollapse"></a>
                </div>Item 3</div>
        </li>
        <li id="listItem_000009">
            <div>
                <div><a class="itemCollapse"></a>
                </div>Item 9</div>
        </li>
        <li id="listItem_000012">
            <div class="hiddenItem">
                <div><a class="itemCollapse"></a>
                </div>Item 12 (Hidden)</div>
        </li>
    </ul>
    <br>
    <br>

    <a class="count">Count</a>

.

    $(".count").click(function () {
        var tcount = $("#dlist").children("li").length;
        alert(tcount);
    });

この例では、js は 4 つのアイテムがあることを警告します。しかし、クラス「hiddenItem」のdivを含む最後のリスト項目のために、3つの項目を警告するようにコードを変更しようとしています。私は .filter() だけでなく、他のいくつかの横断方法を使用しようとしましたが、うまくいきませんでした。誰でも良いアイデアがありますか？

これが機能するフィドルです：http://jsfiddle.net/YeDdq/1/

どんな助けでも大歓迎です。ありがとう！

4

5 に答える 5

13

メソッドを使用できますnot。

var tcount = $("#dlist > li").not(':has(div.hiddenItem)').length;

またはfilter方法：

var tcount = $("#dlist > li").filter(function(){
                 return $('div.hiddenItem', this).length === 0;
             }).length;
于 2013-02-08T09:11:40.850 に答える
5

.notは機能し、読みやすくなっています。

$('#dlist > li').not('.hiddenItem').length;

編集：最初の回答にも.notリストがあることに気付きましたが、なぜhas疑似クラスで複雑になったのかわかりません。

于 2013-12-21T01:58:43.980 に答える
1

：notおよび：hasセレクターを使用できます

$(function() {
    var tcount = $("#dlist li:not(:has(.hiddenItem))").length;
    alert(tcount);
});
于 2013-02-08T09:26:59.740 に答える
1

この場合、フィルターは間違いなく必要です。あなたのフィドルから：

$(".count").click(function () {
    var tcount = $("#dlist").children("li")
    .filter(function() { return !($(this).children().is('.hiddenItem')); })
    .length;
    alert(tcount);
});

これを反映するようにフィドルを更新しました： http://jsfiddle.net/YeDdq/8/

于 2013-02-08T09:13:19.897 に答える
0

これを試して：

var tcount = $("#dlist > li").filter(function(){
                                         return $(this).find(".hiddenItem")
                                                       .length==0;
                                     }).length
于 2013-02-08T09:17:52.403 に答える