챌린지/JavaScript 30일 챌린지
[JavaScript 30일 챌린지] : 10일차
오주현
2022. 2. 6. 22:19
반응형
<script>
const checkboxes = document.querySelectorAll('inbox input[type="checkbox"]');
let lastChecked;
function handleCheck(e) {
let inBetween = false;
if (e.shiftKey && this.checked) {
checkboxes.forEach(checkboxes => {
console.log(checkbox);
if (checkbox === this || checkbox === lastChecked) {
inBetween = !inBetween;
console.log('Starting to check them in between!');
}
if (inBetween) {
checkbox.checked = true;
}
});
}
lastChecked = this;
}
checkboxes.forEach(checkbox => checkbox.addEventListener('click', handleCheck));
</script>
체크 박스를 만들어서 체크가 되면 선이 그어지도록 만들었다.
이런식으로 작동하게 된다.
반응형