Question

    <input type="checkbox" value="On" name="policy" id="policy"></font>
    <b><font face="Verdana" color="#ff0000" size="1">*</font></b>By checking the box, you are verifying with your digital signature that you have read and agree to all terms and conditions of the <a href="Anico_2013-08-26.pdf" target="_blank">FEG agent agreement</a>.
  </td>
</tr>
<tr class="gr">
  <td class="rowdot_lno">Do you agree?:</td>
  <td class="rowdot_lno">
    <input type="checkbox" value="On" name="iagree" id="iagree">
    <b><font face="Verdana" color="#ff0000" size="1">*</font></b>I understand that I will be charged $24.95.
  </td>
</tr>

我有一个<form method="post" action="enroller.dhtml" name="mainform" onSubmit="update_prices()">和一个按钮<input type="submit" value="Continue">

我尝试过一些东西，但无济于事。可以在不选中复选框的情况下提交表单。这是我尝试过的jQuery的最新版本。

$('input[type=checkbox]').each(function () {
        if($(this).is(':checked')) {
            return true;
        }
    });
    alert("Please select at least one to upgrade.");
    return false;
});

我也发现这个小提琴，但它并没有真正起作用..我试着根据我的需要定制它。

http://jsfiddle.net/shryme/D3Ldj/

Answer 1

如果您在提交按钮上有onSubmit或通过jquery添加它，请调用以下函数：

if ($('input[type=checkbox] :checked').length == 0) {
    alert("Please select at least one to upgrade.");
    return false;
} else { return true; }

我希望这就是你要找的东西。

Answer 2

我建议用一些MVVM框架来做，但这里有一些用jQuery做的代码。我这样做是为了禁止提交按钮，除非选中这两个框。

Fiddle with 2 checkboxes and a submit button

function areChecked(){
   var is_1_checked = $('#check_1').is(':checked');  
   var is_2_checked = $('#check_2').is(':checked');

   return is_1_checked == is_2_checked == true;
}

function enableButton(val){
    $('#submit').attr('disabled', false);
}

$('#check_1').on('click', function(){
    if (areChecked())
     enableButton(false);
});

$('#check_2').on('click', function(){
   if (areChecked())
     enableButton(false);
});

Answer 3

从这一行：

请至少选择一个升级

您似乎至少需要选中一个复选框。如果是这种情况，你可以这样做：

$("form").submit(function(){
    var length = $("input[type=checkbox]").not(":checked").length;
    if (length > 1) {
        alert("Please select at least one to upgrade.");
        return false;
    }
});

检查未检查多少个复选框，确定该数字是否小于所需数量，如果是，则触发错误消息。

如果您对CSS选择器感到满意，还可以进一步简化length变量：

var length = $("input[type=checkbox]:not(:checked)").length;

Here's an example.

在提交表单之前，我需要检查两个复选框

3 个答案: