I have a custom checkbox that will print it's value to the console and I want to put a button that will tick the checkbox without executing the checkbox event. This is for educational purpose only.
$(document).on('click', '#chk', function() {
if (this.checked === true) {
console.log('true');
} else {
console.log('false');
}
});
$(document).on('click', '#chkbtn', function() {
$('#chk').click();
});
.chk {
display: none;
}
.chk + label {
cursor: pointer;
color: #000;
}
.chk:checked + label:after {
font-family: 'FontAwesome';
content: "\f164";
}
.chk + label:after {
font-family: 'FontAwesome';
content: "\f087";
}
<link href="http://ift.tt/1jAc5cP" rel="stylesheet" />
<link href="http://ift.tt/1PinXyn" rel="stylesheet" />
<script src="http://ift.tt/1oMJErh"></script>
<script src="http://ift.tt/1jAc4pg"></script>
<button class="btn btn-default" id="chkbtn">Click me!</button>
<br>
<input type="checkbox" class="chk" id="chk" />
<label for="chk"></label>
if the button is click, I just want the checkbox icon to change but I don't want the event of the checkbox executed. Is there a way to do that?
Aucun commentaire:
Enregistrer un commentaire