Tenho uma opção de checkbox que ao ser ativa, mostra um segundo check. Preciso garantir que o segundo checkbox só esteja ativo se o primeiro estiver. Minha função mostra e esconde o segundo check de acordo com o valor do primeiro, mas eu preciso que ela também desmarque o segundo quando o primeiro for desmarcado e isso não tá funcionando. Podem me ajudar ? Segue meu código.
$("#ck1").click(function() {
if ($("#ck1").is(':checked')) {
$("#ck2").show();
} else {
if ($("#ck2").is(':checked')) {
$("#ck2").prop('checked', false);
}
}
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div>
<input type="checkbox" id="ck1" name="ck1" />
<label for="ck1">Check 1</label>
</div>
<div style="display: none;">
<input type="checkbox" id="ck2" name="ck2" />
<label for="ck2">Check 2</label>
</div>