HTML 입력에서 Escape 단추의 효과를 취소하는 방법은 무엇입니까?

Question

저는 오디오가 재생되고 큰 텍스트 상자에 텍스트를 입력해야하는 오디오를 기반으로 자바 스크립트 게임을 만들고 있습니다. JavaScript는 답변 점수를 얻은 다음 텍스트 상자를 지우고 다음 오디오 클립을 준비하는 데 사용됩니다.

문제 : 어떤 경우에는 빈 <input type="text" /> 내에서 초점을 맞추고있는 동안 esc (탈출) 키를 누르면 텍스트 상자는 오래된 텍스트로 채워됩니다.

나는 MooTools를 사용 중이며 keypress, keydown 및 keyup 내에 운이없는 event.stop() (전달을 중지하고 preventDefault를 실행 함)을 사용해 보았습니다.

텍스트 상자 내에서 [esc] 버튼의 값을 변경하지 못하게하려면 어떻게해야합니까?

Answer 1

입력란에 blur()과 focus()을 호출하여 문제를 해결할 수있었습니다. 파이어 폭스에서 문제가 해결되었다.탈출 할하는 데 필요한 일을하고 그것은 나를 위해 파이어 폭스 (25)에 문제를 해결 끝 return false;

에서 감지

Answer 2

재미있는 문제를 (내가 오디오를 재생하는 키보드 단축키로 [ESC] 키를 사용하고 있기 때문에 중요하다) -이 크롬을 예를 들어 IE에서 발생하지만. 다음은 Chrome과 IE에서 테스트 한 솔루션입니다 (제대로 작동하는 것 같습니다).

확장 된 버전 :

스크립트 페이지 머리글 :

'testinput은'우리가 탈출하지 않도록 설정하는 입력

<script> 
var buff; //Must have global scope 
var input = document.getElementById("testinput"); //Defined here to save cpu (instead of on every key press). 
function CheckPreBuff(e) 
{ 
    var ev = window.event ? event : e; //Get the event object for IE or FF 

    var unicode = (typeof(ev.keyCode) != "undefined")? ev.keyCode : ev.charCode; 
    if(unicode != 27) buff = input.value; //The 'escape' key has a unicode value of 27 
    else input.value = buff; //Only set the input contents when needed, so not to waste cpu. 
} 
</script> 

. testinput의 HTML은 다음과 같습니다 :

<input id="testinput" onkeypress="CheckPreBuff();" onkeyup="CheckPreBuff();" type="text"/> 

공지 사항 'onKeyUp에'와 '때 onKeyPress'모두가 사용되었다 - 기술적으로 만 필요한 사용하더라도한다 'onKeyUp에'가 '때 onKeyPress'이스케이프 키는 동안 잠시 비워가는 텍스트 상자를 방지 우울. (원하는 경우) 지원

수동으로 축소 된 + 오류 방지 + 다중 입력 헤더

스크립트 :

<script> 
var buff = []; 
function InitCPB(obj){if(typeof(obj)=="undefined")return;buff[0]=obj;buff[1]="";obj.onkeypress=CPB;obj.onkeyup=CPB;} 
function CPB(e){if(typeof((buff[0]))=="undefined")return;var ev=window.event?event:e;(((typeof(ev.keyCode)!="undefined")?ev.keyCode:ev.charCode)!=27)?buff[1]=(buff[0]).value:(buff[0]).value=buff[1];} 
</script> 

testinput HTML 태그 (의 ID가 더 이상 필요하지 않지만) :

<input onfocus="InitCPB(this);" type="text"/> 

두 가지 방법 모두 다음 키를 누르기 전에 텍스트 입력 내용을 그대로 유지합니다. d가 '이스케이프', 유니 코드 27이면 이전 텍스트 항목이 텍스트 상자에 다시 입력됩니다 (차별성이므로 모든 키를 누를 때마다 브라우저에 너무 많은 부하가 가해지지 않습니다).

두 번째 버전에서는 이스케이프 키가 비활성화 된 동일한 페이지에서 여러 텍스트 입력을 허용합니다. 위와 같이 onFocus 속성이 설정되어 있으면 (여러 요소가 서로 간섭하지 않을 경우) 이스케이프 키가 비활성화됩니다. IE가 심장 발작을 일으키는 우발적 인 잘못된 구현을 방지하기 위해 전달되는 객체가 정의되었는지 검사합니다!

이 정보가 도움이되기를 바랍니다.

Answer 3

.