Question

我有一个JavaScript函数，用于检查是否选中了复选框。

如果是，则计算选择了多少个复选框，并检查是否达到了所选的最大数量（4）。

事情是：

当我尝试检查第五个时，如何使该功能显示警报并禁用所有未选中的复选框？

即使是那个曾经被检查过的人也是如此。

 function ChkValidate() {

          var chkDytLek = document.getElementById("ChkDytLek");
          var chkDytUSD = document.getElementById("ChkDytUSD");
          var chkDytEU = document.getElementById("ChkDytEU");
          var chkDytCAD = document.getElementById("ChkDytCAD");
          var chkDytCHF = document.getElementById("ChkDytCHF");
          var chkDytAUD = document.getElementById("ChkDytAUD");
          var chkDytGBP = document.getElementById("ChkDytGBP");

          var MaxCount = 0
          var unCheckedCount = 0

          if (chkDytLek.checked == true) {
              MaxCount = MaxCount + 1

              if (MaxCount == 4) {

                  disableIfNotChecked();
              }
          } else {
              unCheckedCount = unCheckedCount + 1 
          }

          if (ChkDytUSD.checked == true) {
              MaxCount = MaxCount + 1

              if (MaxCount == 4) {
                  disableIfNotChecked();
              }
          } else {
              unCheckedCount = unCheckedCount + 1
          }  
          if (ChkDytEU.checked == true) {
              MaxCount = MaxCount + 1
              if (MaxCount == 4) {
                  disableIfNotChecked();
              }
          } else {
              unCheckedCount = unCheckedCount + 1
          }

          if (ChkDytCAD.checked == true) {
              MaxCount = MaxCount + 1

              if (MaxCount == 4) {
                  disableIfNotChecked();
              }
          } else {
              unCheckedCount = unCheckedCount + 1
          }

          if (ChkDytCHF.checked == true) {
              MaxCount = MaxCount + 1

              if (MaxCount == 4) {
                  disableIfNotChecked();
              }
          } else {
              unCheckedCount = unCheckedCount + 1
          }
          if (ChkDytGBP.checked == true) {
              MaxCount = MaxCount + 1

              if (MaxCount == 4) {
                  disableIfNotChecked();
              }
          } else {
              unCheckedCount = unCheckedCount + 1
          }

          if (ChkDytAUD.checked == true) {
              MaxCount = MaxCount + 1

              if (MaxCount == 4) {
                  disableIfNotChecked();


              }
          } else {
              unCheckedCount = unCheckedCount + 1
          }

           if (unCheckedCount >= 4) {                  
              enableIfNotChecked();
           }


      }

当前代码显示警报并在计数为4时禁用复选框。

当我想要在5点发生这种情况时，如果我改变了这一点：

 if (MaxCount == 4) {
                  disableIfNotChecked();

为：

 if (MaxCount == 5) {
                  disableIfNotChecked();

代码将禁用复选框，但也会检查选中的复选框。

我知道如何解决这种情况？

Answer 1

我认为您在尝试选择复选框时需要某种控制。

试试这个：

$('input[type="checkbox"]').on('click', function(event) {
  if(maxCount == 5) {
    event.preventDefault();
    alert('So many checkboxes');
  }    
});

这是小提琴：

http://jsfiddle.net/DrKfE/817/

Answer 2

将其添加到复选框ChkValidate（this）

中的函数调用中

<asp:CheckBox ID="ChkDytCAD" runat="server" GroupName="Monedha" Text="CAD" CssClass="radioMarginLeft" onClick="ChkValidate(this)" ClientIDMode="Static" />

将参数添加到函数中并在函数末尾取消选中，当您勾选4个框时

function ChkValidate(checkbox) {
    ...
    if (MaxCount > 4) {
        checkbox.checked = false;
    }
}

这是一个例子的小提琴，它几乎可以满足您的需求，它只允许您一次最多检查4个方框https://jsfiddle.net/2p069wvb/8/

防止在Javascript中选中复选框

2 个答案: