Question

您好我想知道是否可以使用jQuery检查是否以智能方式检查复选框，让我们说我们使用带有一堆输入字段的开关案例，作为一个例子，我有5个复选框。公司，名称，用户名，年龄，密码。如果你检查公司，我可以运行我的代码。

我想在jQuery中尽可能以最聪明的方式做到这一点，让我们说我想在伪这样的事情

switch(checkboxarray?) {

    case Company: 
    document.write("Company: INPUT FIELD");
    break;

}

我已经对此进行了调查，但我只发现了为一个复选框提供功能的解决方案

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript">  
$(document).ready(function() {
    $('#messageVisibilityCheckbox').change(
        function () {
            if ($('#messageVisibilityCheckbox').is(':checked')) {
                alert('is checked'); //document.write("Company: INPUT FIELD);
            }  
            else {

            }
    });
});
</script>

和HTML：

sinput type="checkbox" id="messageVisibilityCheckbox" name="messageVisibilityCheckbox"/>

所以我没有创建一堆函数，而是想创建一个带有switch case或者相同的函数的函数，我可以为每个复选框添加几行。我需要这个的原因是因为我有30个复选框，其中一半需要额外的输入字段，任何帮助或来源都非常感谢！谢谢！

Answer 1

您可以在同一个父级下对多个单独的HTML元素进行分组，然后使用jQuery's event delegation。

实施例

＆＃13;

$(function() {
    $('#allCheckboxes').on("change", ":checkbox", function () {
        if (this.checked) {
            console.log(this.id + ' is checked');
        } else {
            console.log(this.id + ' is unchecked');
        }
    });
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>

<div id="allCheckboxes">
  <input type="checkbox" id="chkBox1" name="Box1" />
  <input type="checkbox" id="chkBox2" name="Box2" />
  <input type="checkbox" id="chkBox3" name="Box3" />
  <input type="checkbox" id="chkBox4" name="Box4" />
  <input type="checkbox" id="chkBox5" name="Box5" />
</div>

＆＃13;

提示：不要使用document.write()。永远。只要忘记它存在，就没有理由使用这个功能。

使用jQuery检查是否选中了多个复选框？

1 个答案: