Question

<input type="checkbox" name="Package1" value="packagename"> <input type="checkbox" name="Package2" value="packagename"> <input type="checkbox" name="Package3" value="packagename">

如何为用户提交表单所需的任意两个复选框。除非他检查了至少两个复选框，否则用户不应该提交表单？

如何实现？

Answer 1

将复选框重命名为name=package[]，值为1,2,3。

然后在PHP中你将有条件（如果你使用GET方法发送表单，只需将POST更改为GET）：

if (isset($_POST['package']) && count($_POST['package']) >= 2) {/* continue */}

如果您想在浏览器（JS）中验证它，而不是：

<script>

var i = 0;
$('[type="checkbox"]').each(function() {
    if ($(this).is(':checked')) {
        i++;
    }
});

if (i <= 1) {
    return false; // disable sending form when you've checked 1 checkbox in maximum
}

</script>

Answer 2

添加一个仅引用这些复选框的类，然后计算检查的数量。

Answer 3

使用JavaScript验证复选框的快速而肮脏的方法：

<强>的JavaScript

checkCheckboxes = function() {
    var numberOfCheckedCheckboxes = 0;
    var checkbox1 = document.getElementsByName("Package1")[0];
    var checkbox2 = document.getElementsByName("Package2")[0];
    var checkbox3 = document.getElementsByName("Package3")[0];

    if (checkbox1.checked)
    {
        numberOfCheckedCheckboxes++;
    }
    if (checkbox2.checked)
    {
        numberOfCheckedCheckboxes++;
    }
    if (checkbox3.checked)
    {
        numberOfCheckedCheckboxes++;
    }

    alert(numberOfCheckedCheckboxes >= 2);
}

DEMO： JSFiddle

此代码不是最干净的代码块，但它确实完成了工作，如果选中至少2个复选框，则返回true，否则返回false 。为了使其更清晰，您可以将每个复选框的name值更改为相同的名称，例如＆＃34; packages＆＃34;，然后使用document.getElementByName("packages")，然后使用for-each循环循环遍历每个元素并检查其检查状态（我将在JSFiddle或JSBin中提供一个演示，但是在这种情况下，Google Chrome似乎阻止了该脚本）。无论复选框的数量如何，使用for-each实现都可以使用相同数量的代码。

Answer 4

在HTML中，你不能。

您可以对客户端JavaScript或表单数据的服务器端处理或两者施加限制。像往常一样，客户端限制本质上是不可靠的，应该被视为对用户的方便，而不是做任何事情的可靠方法。服务器端处理取决于所使用的服务器端技术。

如何在HTML中使用三个复选框中的三个？

4 个答案: