J'essaie d'activer un bouton lors d'une case à cocher, mais je ne sais pas ce que je fais mal avec mon code.
p>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="custom-control custom-checkbox">
<input type="checkbox" class="custom-control-input checkboxdav" id="customCheck1">
<label class="custom-control-label" for="customCheck1">Declaro que tengo la autorización del
propietario del vehÃculo para suministrar sus datos a Davivienda para la compra del
SOAT.</label>
</div>
<div class="col-12 px-0 d-flex justify-content-center mt-3">
<button type="submit" id="submit-form" class="submit primary-btn px-4 py-2"
disabled>Cotizar</button>
</div>3 Réponses :
La valeur d'attribut cochée ne change pas avec l'état de la case à cocher, tandis que la propriété Donc, vous pouvez mettre à jour votre code comme: cochée fait. Par conséquent, le moyen compatible entre navigateur croisé de déterminer si une case à cocher est cochée est d'utiliser la propriété comme:
si (elem.checked)
si ($ (elem) .prop ("coché"))
si ($ (elem) .is (": coché"))
J'ai eu ceci sur la console jquery__webpack_imported_module_1 ___ par défaut (...) (...). Le bouton n'est pas une fonction à HTMLUPUPUTELYE.EVAL (index.js? B635: 7) à HTMLUPUTELYENT.DISPATCH (JQuery.js? 1157: 5237 ) à htmlinputelement.elemdata.handle (jquery.js? 1157: 5044)
Ce code devrait fonctionner correctement.
<!DOCTYPE html>
<html>
<head>
<title>Bootstrap Example</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js"></script>
</head>
<body>
<div class="container">
<h2>Dropdowns</h2>
<p>The .dropdown class is used to indicate a dropdown menu.</p>
<p>Use the .dropdown-menu class to actually build the dropdown menu.</p>
<p>To open the dropdown menu, use a button or a link with a class of .dropdown-toggle and data-toggle="dropdown".</p>
<input type="checkbox" class="custom-control-input checkboxdav" id="customCheck1">
<label class="custom-control-label" for="customCheck1">Declaro que tengo la autorización del
propietario del vehÃculo para suministrar sus datos a Davivienda para la compra del
SOAT.</label>
</div>
<div class="col-12 px-0 d-flex justify-content-center mt-3">
<button type="submit" id="submit-form" class="submit primary-btn px-4 py-2"
disabled>Cotizar</button>
</div>
</div>
</body>
<script>
$(document).ready(function() {
$(".checkboxdav").on("change", function(e) {
if ($(".checkboxdav").is(":checked")) {
$(".submit").prop('disabled', false);
} else {
$(".submit").prop('disabled', true);
}
});
});
</script>
</html>
Travaille pour moi! Merci
essayez de suivre le code suivant.
$('.checkboxdav').on('change', function (e) {
e.preventDefault();
if ($(this).is(':checked')) {
$('#submit-form').attr('disabled', true);
} else {
$('#submit-form').removeAttr('disabled', 'disabled');
}
});
des erreurs de console? Aussi ce qui est
.button ('Activer') ?Fixez votre HTML aussi
Changer le
.button ('Activer') mais aucune erreur de console avec ce nouveau changement