는 - 우수한 라이브러리

를이 내 코드 입력는

function searchForProductsInPopup(evt) { 
    var charCode = (evt.which) ? evt.which : evt.keyCode; 
    alert("in"); 
    if(charCode == 27) { 
      closePopup(); 
    } 
    else if(charCode == 13) { 
      closePopup(); 
      return false; 
    } 
}

HTML 코드

<input type="text" 
     class="input-medium focused" 
     id="invoiceSearchKeyWord" 
     onkeydown="return searchForProductsInPopup(event);"/>

이 기능은 다른 모든 키, 텍스트 상자의 keyup 이벤트를 실행합니다

내 코드는 이고 은입니다. 그러나 Enter 키를 누르면 경고가 표시되지 않고 직접 양식이 제출됩니다. 이유가 무엇입니까? JS에 대한 나의 지식은 매우 제한적입니다. 아무도 설명 할 수 있니?

출처

2017-09-08 Arun Sudhakaran

때문에 - 기본 이벤트와 액션은 여전히 실행됩니다. 만약'charCode === 13'이라면'event.preventDefault()'를 사용하여 디폴트 submit 이벤트를 보내지 않도록하십시오. – somethinghere

하지만 @somethinghere에서는 경고 자체가 나타나지 않고 어떻게 그 조건을 검사 할 수 있습니까? 나는 결코 함수를 실행하지 않는다고 생각합니다. 파이어 폭스에서 디버깅을했지만 실행은 일어나지 않습니다 –

submit 이벤트는 keyup 이벤트 전에 트리거됩니다 : 당신이 제대로 submit 이벤트를 방지하는 경우

<form onsubmit="alert('submitted')"> 
    <input onkeyup="alert('keyup')"/> 
</form> 

1. submitted 
2. Page navigates

https://jsfiddle.net/DerekL/pvw1dtb7/

당신은 예상 keyup 이벤트를 볼 수 있습니다. 이런 식으로 뭔가 : 형태가 Enter 키를 누르면 취소되지 않는`submit` 이벤트가

<form onsubmit="alert('submitted'); event.preventDefault();"> 
    <input onkeyup="alert('keyup')"/> 
</form> 

1. submitted, event stopped 
2. keyup

https://jsfiddle.net/DerekL/dmpxjt27/

출처

2017-09-08 09:03:55

@ event.preventDefault(); **를 추가하여 @Derek 朕會功夫을 ** 키 입력시 제출하지 않도록 양식의 속성을 변경하고 있습니다. 권리? –

예, 브라우저가 기본적으로 해당 이벤트로 수행 할 작업을 차단합니다. –

하지만 @Derek 朕會功夫, 내 양식에 ** event.preventDefault(); **를 추가 한 후 click 이벤트가 작동하지 않는 submit 유형의 컨트롤 (제출 버튼)이 있었지만 버튼 대신 양식이 제출하는 양식 제출 기능을 정의하십시오. 왜 그런가요? –

는

답변

관련 문제