Question

下面是我的php表单中的复选框列表。我需要编写一个脚本，其中只有最后三个复选框必须检查才能成功提交表单。我看过其他类似的问题，但似乎无法找到我真正想要的东西，而且我无法编写脚本。

<input type="checkbox" name="checkbox" value="Send email request">Would you like to receive weekly new via email?<br>
<input type="checkbox" name="checkbox" value="Agree to T&C">I agree to the Terms and Conditions<br> 
<input type="checkbox" name="checkbox" value="No Criminal Records">I have no criminal associations<br>
<input type="checkbox" name="checkbox" value="No Business with any other company">I have no personal or business relationship with any other company<br>

Answer 1

您无需使用任何JavaScript。

只需在输入元素中添加required属性即可。

<input type="checkbox" required="required" name="checkbox" value="Send email request">Would you like to receive weekly new via email?<br>

请点击此处了解详情：http://www.the-art-of-web.com/html/html5-checkbox-required/

如果您需要自定义消息或响应，则需要使用JavaScript来处理此问题。

Answer 2

或者，你可以使用jQuery检查它是否确实是最后3个复选框，或者在提交之前被检查（必需）。考虑这个例子：

<form method="POST" action="index.php" id="form">
    <input type="checkbox" name="checkbox[]" value="Send email request">Would you like to receive weekly new via email?<br>
    <input type="checkbox" name="checkbox[]" value="Agree to T&C">I agree to the Terms and Conditions<br>
    <input type="checkbox" name="checkbox[]" value="No Criminal Records">I have no criminal associations<br>
    <input type="checkbox" name="checkbox[]" value="No Business with any other company">I have no personal or business relationship with any other company<br>
    <input type="submit" name="submit" />
</form>

<script src="jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
    $('#form').submit(function(e){
        var count = 0;
        var required_indeces = [1,2,3];
        $('input[type=checkbox]').each(function(index, element){
            if($.inArray(index, required_indeces) !== -1 && $(this).is(':checked')) {
                count++;
            }
        });

        if(count < 3) {
            e.preventDefault();
        }
    });
});
</script>

Answer 3

复选框需要有不同的名称。使用相同的名称意味着您只存储最后一个复选框的值。尝试以下两个选项之一（对于PHP）：

<input type="checkbox" name="checkbox[]" value="Send email request">Would you like to receive weekly new via email?<br>
<input type="checkbox" name="checkbox[]" value="Agree to T&C">I agree to the Terms and Conditions<br> 
<input type="checkbox" name="checkbox[]" value="No Criminal Records">I have no criminal associations<br>
<input type="checkbox" name="checkbox[]" value="No Business with any other company">I have no personal or business relationship with any other company<br>

然后，检查最后三个是否被检查：

if (!isset($_POST['checkbox'][1], $_POST['checkbox'][2], $_POST['checkbox'][3])) {
    echo 'One of the last 3 NOT checked!';
}

或

<input type="checkbox" name="checkbox1" value="Send email request">Would you like to receive weekly new via email?<br> <input type="checkbox" name="checkbox2" value="Agree to T&C">I agree to the Terms and Conditions<br> <input type="checkbox" name="checkbox3" value="No Criminal Records">I have no criminal associations<br> <input type="checkbox" name="checkbox4" value="No Business with any other company">I have no personal or business relationship with any other company<br>

然后：

if (!isset($_POST['checkbox2'], $_POST['checkbox3'], $_POST['checkbox4'])) { echo 'One of the last 3 NOT checked!'; }

必须检查最后三个复选框才能提交

3 个答案: