입력란에 'enter'키 이벤트가 발생하면 가장 가까운 제출 버튼을 클릭하십시오.

Question

페이지에 제출 버튼이 여러 개 있습니다. 내가 원하는 것은 사용자가 입력 필드에 엔터를 누르면 관련 제출 버튼을 클릭해야한다는 것입니다. 나는 아래의 방법을 시도했지만 심지어 입력란에 키를 눌러 잡을 수 없었다. 사전에

감사합니다,

$('* input').keypress(function (e) { 

     if ((e.which && e.which == 13) || (e.keyCode && e.keyCode == 13)) { 
      $(this).closest('input[type=submit]').click(); 

     } 
}); 

Answer 1

이보십시오. .closest()은 제출 버튼이 DOM 트리의 위쪽에 있지 않으면 작동하지 않습니다. 대신 입력의 parentNode 내에서 검색하거나 양식을 제출할 수 있습니다 (하지만 양식 요소가 없을 수도 있습니다. 그렇지 않으면 Enter 키의 기본 동작이 될 수 있기 때문입니다).

$(document).ready(function() { 
    $('input[type="text"], input[type="password"]').keypress(function (event) { 
     if (event.keyCode == '13') { //jquery normalizes the keycode 

      event.preventDefault(); //avoids default action 
      $(this).parent().find('input[type="submit"]').trigger('click'); 
      // or $(this).closest('form').submit(); 
     } 
    }); 
}); 

Answer 2

자바 스크립트가 필요하지 않습니다.

Enter 키는 표준에 따라 "암시 적 제출"을 호출합니다. 양식에 여러 입력 [유형 = 제출], 첫 번째는 묵시적으로 입력에 의해 "클릭"됩니다. 따라서 기본 단추를 첫 번째 단추에 배치해야합니다.
일부 단추를 교체하려면 CSS 규칙을 사용하십시오.

버튼과 Enter 키에 대한 흥미로운 사실은 here입니다.