Praćenje tastera modifikatora u JavaScript-u

Pomoću objekta Event možemo saznati da li su u trenutku događaja bili pritisnuti tasteri Ctrl, Alt i Shift. Ovo se radi pomoću svojstava ctrlKey, altKey i shiftKey - ona imaju vrednost true ili false u zavisnosti od toga, da li je taj taster bio pritisnut u trenutku događaja ili ne.

Pogledajmo na primeru. Neka imamo dat sledeći dugme:

html<button id="elem">text</button>

Na klik na dugme, ispisaćemo poruku o tome, da li je bio pritisnut neki od tastera Ctrl, Alt i Shift:

javascriptlet elem = document.querySelector('#elem');

elem.addEventListener('click', function(event) {
  if (event.ctrlKey) {
    console.log('pritisnut Ctrl');
  }
  
  if (event.altKey) {
    console.log('pritisnut Alt');
  }
  
  if (event.shiftKey) {
    console.log('pritisnut Shift');
  }
});

Задание 1

Dat je element. Uredite ga tako da na klik na njega bude obojen u crvenu boju, ali samo ako je u trenutku klika pritisnut taster Alt.

Задание 2

Neka imate listu ul sa tagovima li:

html<ul id="elem">
  <li>text</li>
  <li>text</li>
  <li>text</li>
  <li>text</li>
  <li>text</li>
</ul>

Uredite tako da na klik na bilo koji li, na kraj njegovog teksta bude dodato 1, ako je pritisnut taster Ctrl, i 2, ako je pritisnut taster Shift.