Question

我收到了jquery的新任务。我发布了代码片段直到我尝试过。

＆＃13;

$(document).on("click", ".add", function (e) {
    e.preventDefault();
    $.ajax({
        url: url,
        type: "post",
        data: postdata,
        success: function (data) {
            var count = $('#counts').children('li span').length;
           
        }
    })
});

＆＃13;

li{
  list-style-type: none;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="main">
<ul class="top-ul">
<li> </li>
<li><ul class="counts">
  <li><span>5</span></li>
  <li><span>6</span></li>
  </ul></li>
<li><ul class="counts">
  <li><span>8</span></li>
  <li><span>2</span></li>
  </ul></li>
</ul>
</div>

<button class="add">
Add result
</button>
<div>
<p class="result">
</p>
</div>

＆＃13;

此后我真的不知道该怎么办。我的问题是

如何将所有span元素值计数附加到.class元素（单击按钮时）。 span元素值可能会动态变化。

提前致谢。

Answer 1

我不理解你的ajax电话......

无论如何，您必须在total元素中循环后首先创建一个等于0的span变量，并将结果添加到total ...

$(document).on("click", ".add", function (e) {
    var total = 0;
    $(".counts li span").each(function(){
      total += parseInt($(this).text());
    });
    $(".result").text(total)
});

li{
  list-style-type: none;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="main">
<ul class="top-ul">
<li> </li>
<li><ul class="counts">
  <li><span>5</span></li>
  <li><span>6</span></li>
  </ul></li>
<li><ul class="counts">
  <li><span>8</span></li>
  <li><span>2</span></li>
  </ul></li>
</ul>
</div>

<button class="add">
Add result
</button>
<div>
<p class="result">
</p>
</div>

如何追加元素值计数

1 个答案: