Wie kann ich den Wert eines Bootstrap4-Kontrollkästchens erhalten?

Question

Ich habe folgendes Kontrollkästchen:

<label class="custom-control custom-checkbox"> 
    <input type="checkbox" class="custom-control-input" id="modal_checkbox"> 
    <span class="custom-control-indicator"></span> 
    <span class="custom-control-description">Do not show me this again.</span> 
</label> 

Aber ich weiß nicht, wie Sie den Wert der Option erhalten jquery verwenden. Ich habe versucht, die Attr oder die Stütze der oben genannten Klassen und ID zu bekommen, aber ich bekomme eine "undefined"

Answer 1

Dies ist bcoz Sie haben keine Wert-Attribut. Überprüfen Sie diesen Code.

$(function() { 
 
    console.log($("#modal_checkbox").val()); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<label class="custom-control custom-checkbox"> 
 
    <input type="checkbox" class="custom-control-input" id="modal_checkbox" value="my-value"> 
 
    <span class="custom-control-indicator"></span> 
 
    <span class="custom-control-description">Do not show me this again.</span> 
 
</label>

Wenn Sie den Wert auf Checkbox tun dies

$(function() { 
 
     $("#modal_checkbox").click(function() { 
 
     if($(this).is(":checked")) { 
 
      console.log($(this).val()); 
 
     } 
 
     }); 
 
    });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
    <label class="custom-control custom-checkbox"> 
 
     <input type="checkbox" class="custom-control-input" id="modal_checkbox" value="my-value"> 
 
     <span class="custom-control-indicator"></span> 
 
     <span class="custom-control-description">Do not show me this again.</span> 
 
    </label>