검토하기: jQuery를 이용하여 form 처리하기

by 조쉬 posted Mar 02, 2017
?

단축키

Prev이전 문서

Next다음 문서

ESC닫기

크게 작게 위로 아래로 댓글로 가기 인쇄
jQuery를 이용해서 폼을 처리하기 위해서는, 'submit' 이벤트를 위해 이벤트 리스너를 form 요소에 추가해야 합니다:
$("form").on("submit", function() {
   // process form
});
만약 폼 처리를 완전히 jQuery 내에서 한다면, 페이지를 다시 불러오는 것을 방지하기 위해 preventDefault()를 호출해야 합니다:
$("form").on("submit", function(event) {
   event.preventDefault();
   // process form
});
사용자가 폼 내부의 input에 무엇을 입력했는지 알고싶을 때, 일반적으로 val()을 사용합니다:
var answer = $("#answer").val();
콜백 함수 내부에서, this 키워드를 사용해서 폼 요소를 참조할 수 있습니다. 흔한 패턴은 폼 요소 내부의 입력값만을 찾기 위해서 폼 요소에서 find()를 호출하는 것입니다:
$("form").on("submit", function() {
  // store the value of the input with name='age' 
   var age = $(this).find('[name=age]').val();
});