Jquery 仅当选中复选框时提交表单_Jquery_Html_Forms_Checkbox_Submit

Jquery 仅当选中复选框时提交表单

jquery html forms checkbox

Jquery 仅当选中复选框时提交表单,jquery,html,forms,checkbox,submit,Jquery,Html,Forms,Checkbox,Submit,对于与以下示例代码类似的示例代码，当用户点击submit时，如何使用Jquery执行以下操作 1）检查复选框是否已选中。 -如果是，请提交表格。 -如果没有，则显示警报“请在提交表单之前选中该框”，取消表单提交。 2）之后，选中复选框后，可以提交表单提交前请勾选此框您可以在复选框中添加required属性。我建议您也将文本包装在标签中 <label> <input type="checkbox" name="chbox" id="chbox" required&g

对于与以下示例代码类似的示例代码，当用户点击submit时，如何使用Jquery执行以下操作 1）检查复选框是否已选中。 -如果是，请提交表格。 -如果没有，则显示警报“请在提交表单之前选中该框”，取消表单提交。 2）之后，选中复选框后，可以提交表单


提交前请勾选此框

您可以在复选框中添加required属性。我建议您也将文本包装在标签中

<label> <input type="checkbox" name="chbox" id="chbox" required>Check this box before submission </label>

提交前选中此框


提交前请勾选此框


$（函数（）
{
$（“#myForm”）。在（'submit'，函数（）
{
if（document.getElementById（“chbox”）.选中）
{
$（“#我的表格”）.submit（）；
}
其他的
{
e、 预防默认值（）；
警告（“提交表格前请勾选此框”）；
}
});
});

请使用表单提交的代码进行更新。

$（“#chbox”）.is（“：checked”）

将返回true复选框，否则为false

<html>
<head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
</head>
<body>
<form id="myForm">
    <input type="checkbox" name="chbox" id="chbox">Check this box before submission
    <br>
    <input type="submit" value="submit" id="submit">
</form>
<script type="text/javascript">
    $(function ()
    {
        $("#myForm").on('submit', function ()
        {
            if (document.getElementById("chbox").checked)
            {
                $("#myForm").submit();
            }
            else
            {
                e.preventDefault();
                alert('Please check the box before submitting the form');
            }
        });
    });
</script>
</body>
</html>