JavaScript의 특정 키의 키 누르기 이벤트 변경하기

Question

텍스트 상자 안의 각 키의 문자 코드를 보여주는 프로젝트 작업 중입니다.

내 문제는 특정 키, 즉 때 : 누르면 16, 8,

(32) 내가이 키가 정상 동작을 유지하려면 : Shift 키, 백 스페이스, 스페이스가 아래로 누르면, 자신의 문자 코드처럼 나타납니다 . 그 공백으로 인해 텍스트 상자에 공백이 생기고 백 스페이스가 문자를 삭제하는 등 ... 나머지 문자는 문자 코드를 계속 출력합니다.

어떻게해야합니까?

Answer 1

키를 확인하고 그에 따라 처리 할 수 ​​있습니다. 이 시프트, 백 스페이스, 우주 키를 누르면 될 수 있습니다

document.getElementById("test-textbox").addEventListener("keypress", function(event) { 
 
    var code = event.keyCode || event.which; 
 
    
 
    if(code === 16 || code === 8 || code === 32) //check if space, shift, or backspace 
 
     return; //if yes, allow 
 
    
 
    console.log(code); //if not, log value 
 
    event.preventDefault(); //prevent entry 
 
});

<input type="text" id="test-textbox">

하지만, 다른 모든 기록됩니다 여기 데모입니다.

Answer 2

만큼 당신이 ...

이 에게 이

1. 가 preventDefault 이벤트 객체에 대한 방법 및
2. 이벤트 핸들러

에서 false을 반환하지 않는 전화를하지 않습니다 ... 당신이해야으로 벌금. 특히

, 핸들러 ...

function showCharCode(event) { 
    // NOTE: Don’t call `event.preventDefault()` here. 
    document.querySelector('.char-code').textContent = event.charCode; 
    // NOTE: Don't return false here. 
} 

는 ... 여전히 기본 텍스트 상자 (또는 입력, 또는의 contentEditable) 요소에 이벤트를 전달합니다.

Answer 3

나는 이것이 당신을 위해 일할 것이라고 생각합니다.

var elementID = document.getElementById('elementID'); 

elementID.onkeydown = function(event) { 
    var key = event.keyCode || event.charCode; 

    if(key == 32 || key == 8) 
     event.preventDefault(); 
};