Tracciamento dei tasti modificatori in JavaScript
Tramite l'oggetto Event è possibile sapere
se al momento dell'evento erano premuti i tasti Ctrl,
Alt e Shift. Questo si fa
utilizzando le proprietà ctrlKey, altKey
e shiftKey - hanno un valore true
o false a seconda che quel tasto fosse
premuto al momento dell'evento o meno.
Vediamo un esempio. Supponiamo di avere il seguente pulsante:
<button id="elem">text</button>
Al click sul pulsante, visualizzeremo un messaggio
che indica se era premuto uno dei tasti Ctrl,
Alt e Shift:
let elem = document.querySelector('#elem');
elem.addEventListener('click', function(event) {
if (event.ctrlKey) {
console.log('Ctrl premuto');
}
if (event.altKey) {
console.log('Alt premuto');
}
if (event.shiftKey) {
console.log('Shift premuto');
}
});
Dato un elemento. Fai in modo che al click
su di esso diventi rosso, ma solo
se al momento del click è premuto il tasto Alt.
Supponi di avere una lista ul con tag
li:
<ul id="elem">
<li>text</li>
<li>text</li>
<li>text</li>
<li>text</li>
<li>text</li>
</ul>
Fai in modo che al click su qualsiasi li,
alla fine del suo testo venga aggiunto il numero 1,
se è premuto il tasto Ctrl, e il numero
2, se è premuto il tasto Shift.