[JS] Mac에서의 컨트롤키 찾기

키보드 이벤트(keypress, keydown, keyup)가 발생할 때 전달받는 이벤트 객체에는 지금 눌려있는 특수키를 알 수 있는 속성이 포함되어 있다. 예를 들어, 전달받은 이벤트 객체를 oEvent라고 하면, oEvent.shiftKey 속성의 값을 사용해서 shift key가 눌렸는지 알 수 있다. 이 속성값이 true라면 눌린 것이고, 그렇지 않다면 눌리지 않은 것이다.

다른 운영체제와 달리 Mac에는 커맨드 키(Command key)라는 특수한 키가 있고, Windows에서 Control 키가 그러하듯 여러가지 단축키로 사용한다. 예를 들어, Windows에서는 복사를 하기 위해 Ctrl+C 를 단축키로 사용하지만, Mac에서는 Command+C를 사용한다. 커맨드 키는 oEvent.metaKey 속성의 값을 살펴보면 눌렸는지의 여부를 알 수 있다.


어쨌든… shiftKey, ctrlKey, altKey, metaKey 속성을 사용하면 자바스크립트로 단축키 기능을 만들 수 있다. 예컨데, ctrl+B가 눌렸는지 알고 싶다면 다음과 같이 작성하면 된다.

if (oEvent.ctrlKey &&
   oEvent.keyCode == 66 &&
   !oEvent.shiftKey &&
   !oEvent.altKey &&
   !oEvent.metaKey)
{
	alert('ctrl+B');
}

이렇게 작성하면 운영체제에 관계없이 ctrl+B를 검출 할 수 있다… 였으면 좋겠지만 실상은 그렇지 않다. Mac에서는 특이하게 Ctrl 키만 눌렀음에도 불구하고 metaKey까지 같이 눌린 것으로 나타난다. 그렇기 때문에 Linux와 Windows에서는 잘 동작하는 위의 코드가 Mac에서는 동작하지 않는다.

따라서, Mac에서는 Ctrl 키만 눌린 경우를 찾고 싶다 해도, ctrlKey와 metaKey가 둘 다 true인 조건을 찾아야 한다. 따라서 위 코드는 다음과 같이 변경할 수 있다.

if (oEvent.ctrlKey && oEvent.keyCode == 66 && !oEvent.shiftKey && !oEvent.altKey) {
	alert('ctrl+B');
}

하지만, altKey 혹은 shiftKey와 조합되는 단축키를 사용하려면 metaKey 체크를 해서 shift+B와 shift+meta+B가 혼동되지 않도록 해주는 것이 좋다.

Leave a Reply