EN
JavaScript - onchange event for input checkbox element example
1
points
In this article few ways how to handle change event for input checkbox element has been described.
1. onchange attribute example
// ONLINE-RUNNER:browser;
<!doctype html>
<html>
<body>
<label>
<input type="checkbox" onchange="onChange(this)" /> Agreement
</label>
<script>
function onChange(element) {
console.log('Agreement changed to ' + element.checked + ' by onchange event.');
}
</script>
</body>
</html>2. onchange property example
// ONLINE-RUNNER:browser;
<!doctype html>
<html>
<body>
<label>
<input id="agreement" type="checkbox" /> Agreement
</label>
<script>
var agreement = document.getElementById('agreement');
agreement.onchange = function(element) {
console.log('Agreement changed to ' + agreement.checked + ' by onchange event.');
};
</script>
</body>
</html>3. addEventListener method example
// ONLINE-RUNNER:browser;
<!doctype html>
<html>
<body>
<label>
<input id="agreement" type="checkbox" /> Agreement
</label>
<script>
var agreement = document.getElementById('agreement');
agreement.addEventListener('change', function(element) {
console.log('Agreement changed to ' + agreement.checked + ' by change event.');
});
</script>
</body>
</html>