1

我正在创建一个应用程序目录,每个应用程序都有自己的评论,这些评论在用户打开它们之前是隐藏的。我想显示每个应用程序当前包含的评论数,但我只能让它显示页面上的评论总数(请参阅 JSFiddle:http: //jsfiddle.net/9M4nw/2/了解基本示例)。理想情况下,它应该在顶部框中显示 2,在底部框中显示 4。我想我可能需要使用数组或类似的东西?

这是我的代码:

HTML

<div class="parent">
    <div class="child"></div>
    <div class="child"></div>
    <div class="child"></div>
    <div class="child"></div>
</div>

jQuery

$(".parent").each(function(index){
    var numChilds = $(".child").length;
    $(".parent").append(numChilds);
});
4

4 回答 4

3

您必须选择当前的 HTML 元素(使用 class parent)。然后,您将使用它来选择带有 class 的元素的长度.child和 html 的.counter.

使用您可以从函数$(this)中选择当前的 HTML 元素。each()更正的代码:

$(".parent").each(function(){
    var numChilds = $(".child", $(this)).length;
    $(".counter", $(this)).html(numChilds);
});

JSFIDDLE

于 2013-05-30T11:52:50.213 回答
2

问题是您需要将元素查找的范围限制为所需的parent元素

$(".parent").each(function(index){
    var numChilds = $(".child", this).length;
    $(".counter", this).html(numChilds);
});

另一个版本

$(".parent").each(function(index){
    var $this = $(this);
    var numChilds = $this.find(".child").length;
    $this.find(".counter").html(numChilds);
});

演示:小提琴

于 2013-05-30T11:52:33.350 回答
2

这需要一些额外的工作才能以更优雅的方式显示孩子的数量,但这应该足以理解这个想法

$(".parent").each(function(index){
    var $this = $(this);
    var numChilds = $this.find(".child").length;
    $this.append("<span>" + numChilds + "</span>");
});
于 2013-05-30T11:52:49.780 回答
1

此代码将帮助您分别获取每个父 div 的子项数量:-

  $(document).ready(function () {   
                      $(".parent").each(function (i)  {  
                                $(this).children().length;
                            });
                      });

试试这个希望这可以帮助你。投票

于 2013-05-30T13:37:28.237 回答