javascript : 자바스크립트에서 Enter 키를 차단 (with jQuery)

 

자바스크립트에서 Enter 키를 차단하기 위해서는 event.preventDefault() 메소드를 사용해야 합니다.

일반적으로 keydown 이벤트를 사용하여 Enter 키를 차단할 수 있습니다. 예를 들어, 다음과 같이 코드를 작성할 수 있습니다.

 

document.addEventListener("keydown", function(event) {
  if (event.key === "Enter") {
    event.preventDefault();
  }
});

 

위 코드에서는 keydown 이벤트가 발생할 때, 이벤트 객체의 key 속성이 "Enter" 인지 확인하고, preventDefault() 메소드를 호출하여 기본 이벤트를 차단합니다.

 

만약, 특정 HTML 요소에서 Enter 키를 차단하려면, 해당 요소의 keydown 이벤트에 위와 같은 코드를 적용하면 됩니다. 예를 들어, 다음과 같이 input 요소에서 Enter 키를 차단하는 코드를 작성할 수 있습니다.

 

var input = document.getElementById("myInput");
input.addEventListener("keydown", function(event) {
  if (event.key === "Enter") {
    event.preventDefault();
  }
});

 

위 코드에서는 myInput 이라는 ID를 가진 input 요소에서 keydown 이벤트가 발생할 때, Enter 키를 차단하도록 코드가 작성되었습니다.

 

아래는 jquery 로 구현한 방법입니다. 좀 더 간결하네요. 키보드 누르는 이벤트는 keypress() 이며, 이를 통해 컨트롤 가능합니다.

  $(document).keypress(function(e) { 
    if (e.keyCode == 13) e.preventDefault(); 
  });

 

textarea 는 enter 키를 이용하여 입력하므로 제외하도록 하기 위해 e.target 을 통해 node 의 속성을 알 수 있습니다.

$(document).keypress(function (e) {
    if (e.keyCode == 13 && !$(e.target).is('textarea')) e.preventDefault();
});