Javascript Style=“display=none；”在我的项目中无法正常工作

我已经用JavaScript开发了网页。选中并删除“获取两个”复选框时出错。然后显示两个tr，当我未选中复选框时。我如何解决这个问题

检查图像中的错误

有选择2框和删除，但显示3图像和选择3复选框，然后再次删除隐藏的tr文件，但我想隐藏，当我删除选定的文件

第二张图片一定是这样的

但是我的

var-arr=[]； var selectedVal=0； $input[name='invoiceTotal'].changefunction{ selectedVal=this.value； var granTotal=5000； 如果这个被选中了{ arr.pushthis.value； }否则{ //alertselectedVal； arr.拼接arr.indexOfthis.value，1； hidenSelectedselectedVal； } var sum=arr.reducea，b=>parseFloata+parseFloatb，0； console.loggranTotal:+granTotal； console.logsum； console.logsum:+sum； console.logselectedVal:+selectedVal； 如果总和=0{ 隐孢子虫； }如果sumelse如果sum parseFloata+parseFloatb，则为0； //console.loggranTotal:+granTotal； //console.logsum； //console.logsum:+sum； //console.logselectedVal:+selectedVal； 控制台日志和 如果总和=0{ 隐孢子虫； }如果sumelse如果sum parseFloata+parseFloatb，则为0； //console.loggranTotal:+granTotal； //console.logsum； //console.logsum:+sum； //console.logselectedVal:+selectedVal； 控制台日志和 如果总和=0{ 隐孢子虫； }否则，如果sum您必须从

试试下面的代码

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.2.3/jquery.min.js"></script>
<table border="1">
  <tr style="display: ;">
    <th>Month</th>
    <th>Savings</th>
  </tr>
  <tr id="2771.0" style="display: none;">
    <td>a</td>
    <td>$100</td>
  </tr>
  <tr id="2826.0" style="display: none;">
    <td>b</td>
    <td>$200</td>
  </tr>
  <tr id="2087.5" style="display: none;">
    <td>c</td>
    <td>$300</td>
  </tr>
  <tr id="4314.0" style="display: none;">
    <td>d</td>
    <td>$400</td>
  </tr>
  <tr id="5000.0" style="display: none;">
    <td>e</td>
    <td>$500</td>
  </tr>
</table>

<input type="checkbox" class="invot" name="invoiceTotal" value="2771.0">
<input type="checkbox" class="invot" name="invoiceTotal" value="2826.0">
<input type="checkbox" class="invot" name="invoiceTotal" value="2087.5">
<input type="checkbox" class="invot" name="invoiceTotal" value="4314.0">
<input type="checkbox" class="invot" name="invoiceTotal" value="5000.0">

    <script type="text/javascript">
var arr = [];
var selectedVal = 0;


$("input[name='invoiceTotal']").change(function() {
  selectedVal = this.value;
  var granTotal = 5000;

  if (this.checked) {
    arr.push(this.value);
    chowSelected(selectedVal);//Show if it is checked
  } else {
    //alert(selectedVal);
    arr.splice(arr.indexOf(this.value), 1);
    hidenSelected(selectedVal);//Hide if it is unchecked
  }
  var sum = arr.reduce((a, b) => parseFloat(a) + parseFloat(b), 0);
  console.log("granTotal : " + granTotal);
  console.log(sum);
  console.log("sum : " + sum);
  console.log("selectedVal : " + selectedVal);

  if (sum == 0) {
    //hidenUpload();
  } else if (sum <= granTotal) {
    //chowSelected(selectedVal);//Remove this line
  } else {}
});

function chowSelected(j) {
  document.getElementById(j).style.display = 'table-row';
}

function hidenSelected(j) {
  alert(j);
  document.getElementById(j).style.display = 'none';
}
</script>

您必须从中删除所选内容

试试下面的代码

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.2.3/jquery.min.js"></script>
<table border="1">
  <tr style="display: ;">
    <th>Month</th>
    <th>Savings</th>
  </tr>
  <tr id="2771.0" style="display: none;">
    <td>a</td>
    <td>$100</td>
  </tr>
  <tr id="2826.0" style="display: none;">
    <td>b</td>
    <td>$200</td>
  </tr>
  <tr id="2087.5" style="display: none;">
    <td>c</td>
    <td>$300</td>
  </tr>
  <tr id="4314.0" style="display: none;">
    <td>d</td>
    <td>$400</td>
  </tr>
  <tr id="5000.0" style="display: none;">
    <td>e</td>
    <td>$500</td>
  </tr>
</table>

<input type="checkbox" class="invot" name="invoiceTotal" value="2771.0">
<input type="checkbox" class="invot" name="invoiceTotal" value="2826.0">
<input type="checkbox" class="invot" name="invoiceTotal" value="2087.5">
<input type="checkbox" class="invot" name="invoiceTotal" value="4314.0">
<input type="checkbox" class="invot" name="invoiceTotal" value="5000.0">

    <script type="text/javascript">
var arr = [];
var selectedVal = 0;


$("input[name='invoiceTotal']").change(function() {
  selectedVal = this.value;
  var granTotal = 5000;

  if (this.checked) {
    arr.push(this.value);
    chowSelected(selectedVal);//Show if it is checked
  } else {
    //alert(selectedVal);
    arr.splice(arr.indexOf(this.value), 1);
    hidenSelected(selectedVal);//Hide if it is unchecked
  }
  var sum = arr.reduce((a, b) => parseFloat(a) + parseFloat(b), 0);
  console.log("granTotal : " + granTotal);
  console.log(sum);
  console.log("sum : " + sum);
  console.log("selectedVal : " + selectedVal);

  if (sum == 0) {
    //hidenUpload();
  } else if (sum <= granTotal) {
    //chowSelected(selectedVal);//Remove this line
  } else {}
});

function chowSelected(j) {
  document.getElementById(j).style.display = 'table-row';
}

function hidenSelected(j) {
  alert(j);
  document.getElementById(j).style.display = 'none';
}
</script>

---

第二张图片不应该只显示a行吗？很难理解你的问题。@MattMokary我编辑代码请检查。我想你的意思是“受尊重的表行打开和隐藏，使用输入框检查，使用一个条件检查代码取消选中”回答问题第二张图片不应该只显示a行吗？很难理解你在问什么。@MattMokary我编辑代码请检查。我想你的意思是受尊重的表格行打开和隐藏带有输入框复选框和取消选中带有一个条件复选代码回答问题银行这有助于我父亲教育。但我想在c时取消选中总和小于5000。谢谢这有助于我父亲教育。但我当时想要c的未选中总和小于5000。