jquery - 提交表单时，如果未选中复选框，则显示提示并阻止提交表单

Question

编码：

<form>
<div class="term"><input type="checkbox" />I agree to the terms of the privacy </div>
<div id="tip"> please agree the terms of the privacy </div>
</form>

jQuery代码：

 $(document).ready(function() {
            $("#tip").hide();
          jQuery("form").submit(function() {

          if (jQuery('.term').is(':checked')) {
            jQuery("#tip").hide();

          }
          else {
          jQuery("#tip").show();
           return false;
    } 
        });
        });

当我选中复选框，然后提交表单时，提示仍然显示。为什么？

Answer 1

将复选框字段上的术语类定义为

        <div class="test"><input type="checkbox" class="term" />I agree to the terms of the privacy </div>

Answer 2

您显示的代码的问题是您的复选框没有您的 jQuery 选择器使用的类“术语”。它所在的 div 具有“术语”类。因此，您需要将输入更改为如下所示：

<input type="checkbox" class="term" />

或者把 jQuery 选择器改成这样：

if (jQuery('.term input[type="checkbox"]').is(':checked')) {

话虽如此，鉴于正是其中一个复选框，我倾向于给它一个 id 并按 id 选择。

Answer 3

您的“术语”选择器是一个 div，而不是一个复选框。复选框是“术语”的子项

   if( jQuery('.term input:checkbox').is(':checked') ){