JSFiddle - React, Tailwind, and code Playground
HTML
<label>Try it: <input type="checkbox" id="test"></label>
<label>preventDefault on change<input type="checkbox" onclick="no.change=this.checked;"></label>
<label>preventDefault on click<input type="checkbox" onclick="no.click=this.checked;"></label>
CSS
label {
display: block;
}
JavaScript
var no = {
change: false,
click: false
};
$("#test").click(handle).change(handle);
function handle(e) {
console.log("before", e.type, this.checked);
if (no[e.type]) {
e.preventDefault();
console.log("prevented", e.type, this.checked);
}
setTimeout(function() {
console.log("after", e.type, e.target.checked);
},0);
}