动态限制用户可以选中的复选框数量 - php

我创建了一个测试和答案系统。每个问题可以有一个或多个答案，例如“请标记1个答案”，“请标记3个答案”等。

是否可以限制用户可以基于此选中的复选框数量？如果问题需要1个答案，则他们只能选中1个复选框。

<?php foreach ($rows as $row){ ?>
   <input type="checkbox" name="answer<?php echo $counter; ?>[]" value="<?php echo the_sub_field('answer'); ?>" />
   <?php echo $row['answer']; ?>
<?php } ?>

它循环遍历并提取每个答案，每个问题所需的答案数量是动态的，并由此字段控制（可以为1、2、3等）：

<?php echo $repeater_row['required_answers']; ?>

使用下面的jQuery，尽管它不是动态的：

$(document).ready(function () {
    if ($("input:checkbox:checked").length >= 3) {
        $("input:checkbox").not(":checked").attr("disabled", 3);
    }
    $("input:checkbox").click(function () {
        var bol = $("input:checkbox:checked").length >= 3;
        $("input:checkbox").not(":checked").attr("disabled", bol);
    });
});

如何动态进行？每个问题的答案都以集合的形式命名，因此第一个问题的答案集的输入名为name="answer1[]"，第二个问题的答案集的名称为name="answer2[]"，依此类推。

参考方案

我将使用max-answers属性将每组答案包装在div中，并在您的JavaScript中使用该属性值。

这是一个有效的小提琴：http://jsfiddle.net/pVA3d/4/

我的HTML

<div class="question" data-max-answers="2">
    Here's a question with up to two answers: <br>
    <input type="checkbox" name="answer1[]" value="A"> A <br>
    <input type="checkbox" name="answer1[]" value="B"> B <br>
    <input type="checkbox" name="answer1[]" value="C"> C <br>
    <input type="checkbox" name="answer1[]" value="D"> D <br>
</div>
<div class="question" data-max-answers="4">
    Here's a question with up to 4! <br>
    <input type="checkbox" name="answer2[]" value="A"> A <br>
    <input type="checkbox" name="answer2[]" value="B"> B <br>
    <input type="checkbox" name="answer2[]" value="C"> C <br>
    <input type="checkbox" name="answer2[]" value="D"> D <br>
    <input type="checkbox" name="answer2[]" value="E"> E <br>
    <input type="checkbox" name="answer2[]" value="F"> F <br>
</div>

我的JavaScript

$(document).ready(function () {
    $("input[type=checkbox]").click(function (e) {
        if ($(e.currentTarget).closest("div.question").length > 0) {
            toggleInputs($(e.currentTarget).closest("div.question")[0]);        
        }
    });
});

function toggleInputs(questionElement) {
    if ($(questionElement).data('max-answers') == undefined) {
        return true;
    } else {
        maxAnswers = parseInt($(questionElement).data('max-answers'), 10); 
        if ($(questionElement).find(":checked").length >= maxAnswers) {
            $(questionElement).find(":not(:checked)").attr("disabled", true);
        } else {
            $(questionElement).find("input[type=checkbox]").attr("disabled", false);
        }
    }
}

PHP-复选框组 - php

我有一个需要发布的表单复选框组。<input type="checkbox" value="true" checked name="chk0[]"> <input type="checkbox" value="false" name=…

Div单击与单选按钮相同吗？ - php

有没有一种方法可以使div上的click事件与表单环境中的单选按钮相同？我只希望下面的div提交值，单选按钮很丑代码输出如下：<input id="radio-2011-06-08" value="2011-06-08" type="radio" name="radio_date&#…

未提交附加字段值 - php

我在PHP中有一组表单字段。我还添加了jQuery功能来克隆某些字段并将其添加到表单中。但是，在提交表单后，仅提交原始字段，而不提交通过克隆添加的字段。的PHP<form id="myForm" method="post" action"..."> <div class="…

jQuery克隆div内容的次数不定 - php

jQuery：$('#partsOrderQty').blur(function(){ var rowCounter = $(this).val(); console.log(rowCounter); var toAddRow = $("#skidListings").children().clone(); for (…

使用查询获取ID - php

我正在创建一个电子商务网站，我试图添加选项，即买家通过下拉列表选择商品大小，然后将变量传递给jquery，然后将jquery传递给php，如果商品大小可用有库存时，将显示一个添加到购物车按钮，否则显示无库存按钮。我设法使其工作到将项目大小传递给php为止，但是我不知道如何传递产品ID，这是检查数据库所必需的。大小选择：<form id="fo…