Question

我有一段代码在循环中的表中创建复选框并调用它们的onclick函数。在onclick函数中，我尝试填充一个全局数组，该数组将成为表格的选中复选框的位置持有者。此外，如果选中一行，我必须将该行的文本字段中的数字相加（我将其添加到变量百分比），如果变量超过100，我必须提醒用户并要求他在复选框中输入值总和小于100。

发生的事情是，当百分比> 100时，它会抛出一个警报（我已添加）。如果有3个复选框具有值34,56,10并且如果选择这3个，则允许我提交提交按钮。但是如果我回去并取消选中10行，则会发出警告，称percantage是110（应该是90）

如何解决此问题？

代码：

    var tabId = document.getElementById("AmnestyTransTbl");
    var tabrows = tabId.getElementsByTagName('tr');

    var percentage = 0,
        c, n;
    var ar = [];
    for (var i = 1, c = 2; i <= tabrows.length - 3; i++, c = c + 2) {
        // Create CheckBox
        ar[i] = c;
        var checkBox = document.createElement("input");
        checkBox.setAttribute("type", "checkbox");
        checkBox.id = 'CB'.concat(i);
        checkBox.onclick = function () {

            var tabId1 = document.getElementById("AmnestyTransTbl");
            var rowInd = getRowIndex(this);

            CBValue[rowInd] = this.checked;
            n = ar[rowInd - 1];
            percentage = (parseInt(percentage) + parseInt(tabId1.getElementsByTagName("input")[n].value));
            if (parseInt(percentage) > 100) {
                alert("Amnesty Percentage," + percentage + ", greater than 0!. Plesase check again.");
                this.checked = false;
            }
            if (this.checked == false) percentage = parseInt(percentage) - parseInt(tabId1.getElementsByTagName("input")[n].value);
        }
    }
    var td = document.createElement("td");
    td.appendChild(checkBox);
    tabrows[i + 1].cells[1].appendChild(td);
    }

    function getRowIndex(el) {
        while ((el = el.parentNode) && el.nodeName.toLowerCase() != 'tr');
        if (el) return el.rowIndex;
    }

Answer 1

试试这段代码......

    var tabId = document.getElementById("AmnestyTransTbl");
    var tabrows = tabId.getElementsByTagName('tr');

    var percentage = 0,
        c, n;
    var ar = [];
    for (var i = 1, c = 2; i <= tabrows.length - 3; i++, c = c + 2) {
        // Create CheckBox
        ar[i] = c;
        var checkBox = document.createElement("input");
        checkBox.setAttribute("type", "checkbox");
        checkBox.id = 'CB'.concat(i);
        checkBox.onclick = function () {

            var tabId1 = document.getElementById("AmnestyTransTbl");
            var rowInd = getRowIndex(this);

            CBValue[rowInd] = this.checked;
            n = ar[rowInd - 1];
            if (this.checked == false)
                percentage = parseInt(percentage) - parseInt(tabId1.getElementsByTagName("input")[n].value);
            else
                percentage = (parseInt(percentage) + parseInt(tabId1.getElementsByTagName("input")[n].value));
            if (parseInt(percentage) > 100) {
                alert("Amnesty Percentage," + percentage + ", greater than 0!. Plesase check again.");
                this.checked = false;
            }

        }
    }
    var td = document.createElement("td");
    td.appendChild(checkBox);
    tabrows[i + 1].cells[1].appendChild(td);
    }

    function getRowIndex(el) {
        while ((el = el.parentNode) && el.nodeName.toLowerCase() != 'tr');
        if (el) return el.rowIndex;
    }

检查一次无效后，取消选中HTML / Javascript复选框

1 个答案: