버튼이 HTML 및 JavaScript로 양식을 제출하지 못하도록 방지하는 방법은 무엇입니까?

버튼이 양식을 제출하지 못하도록 방지하는 방법

HTML에서는 양식 내에서 버튼을 클릭하면 일반적으로 양식이 트리거됩니다. 제출. 그러나 양식을 제출하지 않고도 버튼이 특정 작업을 수행하기를 원하는 시나리오가 있습니다.

다음 양식을 고려하세요.

<code class="html"><form id="myform">
  <label>Label
    <input />
  </label>
</form>
<button>My Button</button></code>

이 예에서 버튼을 클릭하면 여전히 트리거됩니다. 양식 요소 외부에 있더라도 양식 제출. 이러한 원치 않는 동작을 방지하려면 버튼에 type="button" 속성을 지정할 수 있습니다.

<code class="html"><button type="button">My Button</button></code>

JavaScript를 통한 대체 솔루션

처리를 선호하는 경우 JavaScript를 사용하면 기본 양식 제출 동작을 비활성화할 수 있습니다. 다음은 이벤트 리스너를 사용하는 예입니다.

<code class="html"><button onclick="event.preventDefault();">My Button</button></code>

이 경우 event.preventDefault() 함수는 버튼을 클릭할 때 양식이 제출되는 것을 방지합니다.

결론

버튼에 type="button"을 지정하거나 JavaScript를 사용하여 기본 작업을 억제하면 버튼이 양식 요소 외부에 있는 경우에도 버튼이 양식을 제출하지 못하도록 방지할 수 있습니다.

위 내용은 버튼이 HTML 및 JavaScript로 양식을 제출하지 못하도록 방지하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!