首页 > 解决方案 > 保持jquery函数动作的计数

问题描述

我有以下jquery函数

function checkIfAnyExist() { //new input
    var number = 0;
    if ($(this).length) {
      var number = number + 1;
    }
    console.log(number);
}

我称之为使用:

$("#myTable tr:not(.discarded,.old) td:nth-child(1)").each(checkIfAnyExist);

但是,此代码无法按预期工作,因为每个行号都被重置。我尝试将var number = 0其取出并放在调用函数之上,但这也不起作用。

有任何想法吗?

谢谢

标签: javascriptjqueryhtml

解决方案


您要声明变量两次:一次在函数中,一次在if条件中。这两个定义在函数的每次迭代时都将变量重置为零。

考虑number在函数范围之外声明一次。这样,每次调用函数时它都可以递增。

function checkIfAnyExist() {
  if ($(this).length) {
    number++;
  }
  console.log(number);
}

var number = 0;

$("#myTable tr:not(.discarded,.old) td:nth-child(1)").each(checkIfAnyExist);
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
<table id="myTable">
  <tr><td></td></tr>
  <tr><td></td></tr>
  <tr><td></td></tr>
  <tr><td></td></tr>
  <tr class="discarded"><td></td></tr>
  <tr class="old"><td></td></tr>
</table>

然后,您正在计算不是.discarded或的行中“第一个单元格”的数量.old

正如@TylerRoper 明智地解释的那样,$(this).length在这种情况下永远不会是错误的;传递给函数的每一行都有一个长度。所以这个功能似乎没有用。

jQuery.length本身是一种更有效的计算适当行数的方法:

var rowCount = $("#myTable tr:not(.discarded,.old)").length;
console.log(rowCount ? rowCount + ' rows found.' : 'There are no rows.');
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
<table id="myTable">
  <tr></tr>
  <tr></tr>
  <tr></tr>
  <tr></tr>
  <tr class="discarded"></tr>
  <tr class="old"></tr>
</table>

注意:如果您试图确定有多少行不为空,或者包含多个单元格,或者至少包含一个包含内容的单元格,或者其他更复杂的选择,则情况可能会有所不同。


推荐阅读