HTML 속성 이외의 Javascript에서 양식 제출 이벤트를 어떻게 수신합니까?

Javascript에서 양식 제출 이벤트 수신: HTML 속성을 넘어서

Javascript에서 양식 제출을 감지하는 것은 사용자 입력 및 양식 동작을 제어합니다. onClick 및 onSubmit과 같은 HTML 속성을 사용하면 충분하지만 사용자 정의 및 유연성이 제한됩니다. 이 기사에서는 순수 Javascript 및 일반 라이브러리를 사용하여 양식 제출 이벤트를 수신하는 대체 방법을 살펴봅니다.

순수 Javascript 접근 방식

이벤트 리스너를 양식 요소에 연결하려면 addEventListener를 사용하세요. 또는 브라우저 지원에 따른 attachmentEvent:

<code class="javascript">var ele = /*Your Form Element*/;
if (ele.addEventListener) {
  ele.addEventListener("submit", callback, false); // Modern browsers
} else if (ele.attachEvent) {
  ele.attachEvent("onsubmit", callback); // Old IE
}</code>

네이티브 제출 이벤트를 취소하려면 콜백 함수 내에서 PreventDefault()를 사용하십시오:

<code class="javascript">document.querySelector("#myForm").addEventListener("submit", function (e) {
  if (!isValid) {
    e.preventDefault(); // Stop form from submitting
  }
});</code>

라이브러리 접근 방식

라이브러리(예: jQuery) 사용이 선호되는 경우:

• jQuery:

<code class="javascript">$(ele).submit(callback);</code>

Cross -브라우저 호환성

addEventListener 메소드가 널리 지원되지만 이전 브라우저에는 attachmentEvent가 필요할 수 있습니다. 브라우저 간 호환성을 보장하려면 필요한 경우 두 가지 방법을 모두 사용하세요.

위 내용은 HTML 속성 이외의 Javascript에서 양식 제출 이벤트를 어떻게 수신합니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!