我如何驗證複選框？

Question

<form target="_self" id="immunization_info_form" class="form-validation save_immune25 update_immune25" role="form" method="POST" enctype="multipart/form-data"> 
 
    <div class="form-group row" style="margin-top:10px;height:50px;"> 
 
    <div class="checkbox checkbox-styled col-md-offset-1 col-md-4"> 
 
     <label style="font-size:15px;"><input type="checkbox" id="checkbox25" name="ch" class="checkbx" value="25"> 
 
\t \t \t \t \t \t \t \t \t \t \t <span>Hepatitis A vaccine</span></label> 
 
    </div> 
 
    <div class="form-group col-md-4"> 
 
     <!-- Date input --> 
 
     <input class="form-control edit25" id="date25" name="date" placeholder="Enter Date" value="<?php echo $date[25]; ?>" type="text" required> 
 
    </div> 
 

 
    </div> 
 
    <div class="row" style="padding:15px;"> 
 
    <div class="col-md-3 col-md-offset-1"> 
 
     <div class="form-group"> 
 
     <h3 style="color:orange;">Clinic Name</h3><br> 
 
     <input name="clinic_name" id="clinic" class="form-control edit25" type="text" value="<?php echo $clinic_name[25]; ?>" required> 
 
     <label for="clinic_name"></label> 
 
     </div> 
 
    </div> 
 
    <div class="col-md-4"> 
 
     <div class="form-group"> 
 
     <h3 style="color:orange;">Name of the Health practitioner</h3><br> 
 
     <input name="hp_name" id="hp" class="form-control edit25" type="text" value="<?php echo $practitioner[25]; ?>" required> 
 
     <label for="hp_name"></label> 
 
     </div> 
 
    </div> 
 
    <div class="col-md-3"> 
 
     <div class="form-group"> 
 
     <h3 style="color:orange;">Lot no. of Vaccine</h3><br> 
 
     <input name="lotno" id="lot" class="form-control edit25" type="text" value="<?php echo $lotno[25]; ?>" required> 
 
     <label for="lotno"></label> 
 
     </div> 
 
    </div> 
 
    <div class="row col-md-offset-1"> 
 
     <div class="col-md-6 text-right"> 
 
     <input type="button" name="submit" value="SAVE" class="save btn btn-lg btn-primary ink-reaction justify" id="save_immune25"> 
 
     </div> 
 
    </div> 
 
    </div> 
 
</form>

我已經加了我的html代碼也..

$('.save').on('click', function() { 
 
    var chk = $(this).parent().parent().parent().parent().parent().find('input [name="ch"]').attr('class'); 
 
if ($("." + chk).attr('checked', false)) { 
 
    alert("please check the checkbox"); 
 
    } else { 
 
    alert("you have checked the checkbox"); 
 
    } 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

我曾嘗試使用此代碼，並獲得警報「請勾選」這兩種情況，如果和別的。 我只想驗證複選框是否被選中。如果選中，表示它應該顯示相關消息，如果沒有選中，也應該顯示消息。

Answer 1

有兩件事我注意到：

1. 而是使用.closest()對.parent()多次。
2. 請勿在if條件中設置屬性，而不要使用.attr()使用.prop()。

---

你可以改變這個

var chk = $(this).closest('form').find('input[name="ch"]');// use form if you have one. 
if (!$(chk).prop('checked')) { 

$('.save').on('click', function() { 
 
    var chk = $(this).closest('form').find('input[name="ch"]'); 
 
    if (!$(chk).prop('checked')) { 
 
    alert("please check the checkbox"); 
 
    } else { 
 
    alert("you have checked the checkbox"); 
 
    } 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<form target="_self" id="immunization_info_form" class="form-validation save_immune25 update_immune25" role="form" method="POST" enctype="multipart/form-data"> 
 
    <div class="form-group row" style="margin-top:10px;height:50px;"> 
 
    <div class="checkbox checkbox-styled col-md-offset-1 col-md-4"> 
 
     <label style="font-size:15px;"><input type="checkbox" id="checkbox25" name="ch" class="checkbx" value="25"> 
 
\t \t \t \t \t \t \t \t \t \t \t <span>Hepatitis A vaccine</span></label> 
 
    </div> 
 
    <div class="form-group col-md-4"> 
 
     <!-- Date input --> 
 
     <input class="form-control edit25" id="date25" name="date" placeholder="Enter Date" value="<?php echo $date[25]; ?>" type="text" required> 
 
    </div> 
 

 
    </div> 
 
    <div class="row" style="padding:15px;"> 
 
    <div class="col-md-3 col-md-offset-1"> 
 
     <div class="form-group"> 
 
     <h3 style="color:orange;">Clinic Name</h3><br> 
 
     <input name="clinic_name" id="clinic" class="form-control edit25" type="text" value="<?php echo $clinic_name[25]; ?>" required> 
 
     <label for="clinic_name"></label> 
 
     </div> 
 
    </div> 
 
    <div class="col-md-4"> 
 
     <div class="form-group"> 
 
     <h3 style="color:orange;">Name of the Health practitioner</h3><br> 
 
     <input name="hp_name" id="hp" class="form-control edit25" type="text" value="<?php echo $practitioner[25]; ?>" required> 
 
     <label for="hp_name"></label> 
 
     </div> 
 
    </div> 
 
    <div class="col-md-3"> 
 
     <div class="form-group"> 
 
     <h3 style="color:orange;">Lot no. of Vaccine</h3><br> 
 
     <input name="lotno" id="lot" class="form-control edit25" type="text" value="<?php echo $lotno[25]; ?>" required> 
 
     <label for="lotno"></label> 
 
     </div> 
 
    </div> 
 
    <div class="row col-md-offset-1"> 
 
     <div class="col-md-6 text-right"> 
 
     <input type="button" name="submit" value="SAVE" class="save btn btn-lg btn-primary ink-reaction justify" id="save_immune25"> 
 
     </div> 
 
    </div> 
 
    </div> 
 
</form>