[javascript] JavaScript로 키 프레스 이벤트를 입력하십시오

나는이 form두 개의 텍스트 상자, 하나 를 선택 드롭 다운 하나 개의 라디오 버튼을 . 때 enter키를 누르면, 내가 자바 스크립트 함수 (사용자 정의)를 호출 할,하지만 난 그것을 누르면 양식이 제출됩니다.

키를 누를 form때 제출이 되지 않도록하려면 어떻게합니까 enter?



답변

if(characterCode == 13)
{
    return false; // returning false will prevent the event from bubbling up.
}
else
{
    return true;
}

자, 다음 텍스트 상자가 양식에 있다고 가정하십시오.

<input id="scriptBox" type="text" onkeypress="return runScript(event)" />

Enter 키를 눌렀을 때이 텍스트 상자에서 “사용자 정의”스크립트를 실행하고 양식을 제출하지 않으려면 샘플 코드가 있습니다. 이 기능은 오류 검사를 수행하지 않으며 대부분 IE에서만 작동합니다. 이를 위해서는보다 강력한 솔루션이 필요하지만 일반적인 아이디어를 얻을 수 있습니다.

function runScript(e) {
    //See notes about 'which' and 'key'
    if (e.keyCode == 13) {
        var tb = document.getElementById("scriptBox");
        eval(tb.value);
        return false;
    }
}

함수 값을 반환하면 이벤트 처리기가 이벤트를 더 이상 버블 링하지 않도록 경고하고 키 누르기 이벤트가 더 이상 처리되지 않도록합니다.

노트:

그것은 지적 밖으로이었다 keyCode되고 지금은 추천하지 않습니다 . 다음으로 가장 좋은 대안 which더 이상 사용되지 않습니다 .

불행히도 key최신 브라우저에서 널리 지원되는 표준 은 IE와 Edge에서 약간의 동작을 합니다. IE11보다 오래된 것은 여전히 polyfill이 필요합니다 .

또한, 더 이상 사용되지 않는 경고는 keyCodewhich에 대해 매우 불길하지만 ,이를 제거하면 수많은 레거시 웹 사이트가 크게 변경 될 수 있습니다. 이런 이유로 그들은 언제 어디서나 갈 것 같지 않습니다.


답변

event.which와 모두 사용 event.keyCode:

function (event) {
    if (event.which == 13 || event.keyCode == 13) {
        //code to execute here
        return false;
    }
    return true;
};


답변

jQuery를 사용하는 경우 :

$('input[type=text]').on('keydown', function(e) {
    if (e.which == 13) {
        e.preventDefault();
    }
});


답변

event.key === “입력”

가장 최근의 클리너 :을 사용하십시오 event.key. 더 이상 임의의 숫자 코드가 없습니다!

const node = document.getElementsByClassName(".mySelect")[0];
node.addEventListener("keydown", function(event) {
    if (event.key === "Enter") {
        event.preventDefault();
        // Do more work
    }
});

모질라 문서

지원되는 브라우저


답변

전체 문서에서 Enter 키를 눌렀습니다.

$(document).keypress(function (e) {
    if (e.which == 13) {
        alert('enter key is pressed');
    }
});

http://jsfiddle.net/umerqureshi/dcjsa08n/3/


답변

onsubmit함수의 호출이되도록 양식 의 조치를 대체하고 그 뒤에 return false를 추가하십시오.

<form onsubmit="javascript:myfunc();return false;" >


답변

반응 JS 솔루션

 handleChange: function(e) {
    if (e.key == 'Enter') {
      console.log('test');
    }


 <div>
    <Input type="text"
       ref = "input"
       placeholder="hiya"
       onKeyPress={this.handleChange}
    />
 </div>