Visitar URL original
Challenge #10 completed, can check multiple boxes. · cydseelen/JavaScript30@e615b5b · GitHub
Skip to content

Commit e615b5b

Browse files
committed
Challenge #10 completed, can check multiple boxes.
1 parent 46d6b1b commit e615b5b

1 file changed

Lines changed: 28 additions & 0 deletions

File tree

‎10 - Hold Shift and Check Checkboxes/index-START.html‎

Lines changed: 28 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -96,6 +96,34 @@
9696
</div>
9797

9898
<script>
99+
const checkboxes = document.querySelectorAll('.inbox input[type="checkbox"]');
100+
101+
let lastChecked;
102+
103+
function handleCheck(e) {
104+
// Check if they had the shift key down
105+
// AND check that they are checking it
106+
let inBetween = false;
107+
if (e.shiftKey && this.checked) {
108+
// go ahead and do what we please
109+
// loop over every single checkbox
110+
checkboxes.forEach(checkbox => {
111+
console.log(checkbox);
112+
if (checkbox === this || checkbox === lastChecked) {
113+
inBetween = !inBetween;
114+
console.log('Starting to check them in between!');
115+
}
116+
117+
if (inBetween) {
118+
checkbox.checked = true;
119+
}
120+
});
121+
}
122+
123+
lastChecked = this;
124+
}
125+
126+
checkboxes.forEach(checkbox => checkbox.addEventListener('click', handleCheck));
99127
</script>
100128
</body>
101129
</html>

0 commit comments

Comments
 (0)