jQuery를 사용하여 HTML 양식 제출

이 게시물에서는 jQuery를 사용하여 HTML 양식을 제출하는 방법에 대해 알아봅니다.

jQuery를 사용하여 HTML 양식 제출

.submit() 메서드는 이벤트 핸들러를 JavaScript에 바인딩하여 이벤트를 제출하거나 이 이벤트를 요소에 전달합니다. 제출 이벤트는 사용자가 양식 제출을 시도할 때 항목으로 전송됩니다.

통사론:

.submit(handler)

handler는 이벤트가 발생할 때마다 호출/실행되는 함수이며 <form> 요소에만 첨부할 수 있습니다.

<input type="image">, <button type="submit">, <input type="submit">를 명시적으로 클릭하거나 누르거나 특정 양식 요소가 있을 때 Enter를 눌러 양식을 제출할 수 있습니다. 초점을 맞춥니다. .submit() 메서드가 .on("submit", handler)의 줄임말인 것처럼 .off("submit")를 사용하여 분리가 가능합니다.

양식 및 해당 하위는 제출 방법과 같이 양식의 속성과 충돌하는 유사한 입력 이름 또는 식별자를 사용할 수 없습니다. 이름이 충돌하면 혼란스러운 오류가 발생할 수 있습니다.

.submit()에 대한 .submit() 문서에 대한 자세한 정보를 찾을 수 있습니다.

예:

코드 - HTML:

<form id="myForm">
    <input type="text" value="Hello world">
    <input type="submit" value="Submit">
</form>

코드 - JavaScript + jQuery:

$('#myForm').submit((event) => {
  console.log('.submit() called.');
  event.preventDefault();
});

jQuery를 지원하는 모든 브라우저에서 위의 코드 조각을 실행합니다. 제출 버튼을 클릭하여 ".submit()가 호출되었습니다." 메시지를 표시합니다.

출력:

실행 코드

이벤트 객체에서 .preventDefault()를 호출하거나 핸들러에서 false를 반환하여 제출 이동을 취소할 수 있습니다. 다른 모든 요소를 클릭하는 동안 수동으로 이벤트를 트리거할 수 있습니다.