Question

我有一个表，行数是动态的，取决于数据库记录。因此，无论表行没有，当第一列中的所有行都是100时，第二列中的所有行都将显示＆＃34; done＆＃34;。

现在，当我在第1行输入100时，第2列中的所有行都将显示＆＃34; done＆＃34;。我怎么能等到第1栏中的所有行都是100才能显示＆＃34;完成＆＃34;

＆＃13;

$(".test").on('keyup', function() {

  var set = $('.test').val();
  if (set == 100 ) {
   $('.result').val("done");
     }
  });

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
<table>
<tr>
<td><input type="number" class="test">
<td><input type="text" class="result">
</tr>

<tr>
<td><input type="number" class="test">
<td><input type="text" class="result">
</tr>

<tr>
<td><input type="number" class="test">
<td><input type="text" class="result">
</tr>

＆＃13;

Answer 1

这是实现它的唯一途径。您使用keyup事件代替input。

在每个事件上，检查所有输入字段是否都有值。

如果所有字段都有值，请检查所有字段是否都为100。

＆＃13;

$(".test").on('input', function() {
  checkAndUpdateSecondColumn();
});

function checkAndUpdateSecondColumn() {
  var empty = $("input.test").filter(function() {
    return this.value != "";
  });


  if ($("input.test").length == empty.length) {
    var sum = $('.test').toArray().reduce(function(sum, element) {
      return sum + Number(element.value);
    }, 0);


    $('.result').val('');
    if (sum == $("input.test").length * 100) {
      $('.result').val('done');
    }
  }
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
<table>
  <tr>
    <td><input type="number" class="test">
      <td><input type="text" class="result">
  </tr>

  <tr>
    <td><input type="number" class="test">
      <td><input type="text" class="result">
  </tr>

  <tr>
    <td><input type="number" class="test">
      <td><input type="text" class="result">
  </tr>

＆＃13;

Answer 2

代码的问题在于，在分配变量set时，您正在尝试读取包含多个DOM元素的jQuery集合的.val()。返回第一个匹配元素的值;其他人没有评估。

听起来你想要做的就是评估整个集合，并确保在显示＆＃34;完成＆＃34;之前确保所有值都符合您想要的值。信息。实现此行为的一种方法是过滤jQuery集合中每个元素的值（类"test"的每个元素）。

var testInputs = $('.test');
var desiredValue = 100;

testInputs.on('keyup', function() {
    var testInputsSetToDesiredValue = testInputs.filter(function() {
        return parseInt(this.value, 10) === desiredValue;
    });
    if (testInputsSetToDesiredValue.length === testInputs.length) {
        $('.result').val('done');
    }
});

我怎么能等到第1栏中的所有表格行都是100才能显示＆＃34;完成＆＃34;在第二栏

2 个答案: