<input type = 'button'/>과 <input type = 'submit'/>의 차이점

Question

바보 같은 질문이 없으므로 여기에 나와 있습니다. <input type='button' />과 <input type='submit' />의 차이점은 무엇입니까?

Answer 1

<input type="button" /> 버튼은 양식을 제출하지 않으며 기본적으로 아무 것도하지 않습니다. 일반적으로 AJAX 애플리케이션의 일부로 JavaScript와 함께 사용됩니다.

버튼은 JavaScript로 별도 지정하지 않는 한 사용자가 클릭 할 때의 양식을 제출합니다.

Answer 2

'버튼'은 바로 자바 스크립트를 사용하여 기능을 추가 할 수있는 버튼입니다. '제출'입력 유형에는 배치 된 양식을 제출하는 기본 기능이 있습니다 (단, 물론 자바 스크립트를 사용하여 추가 기능을 추가 할 수 있음).

Answer 3

버튼은 자체적으로 양식을 제출하지 않습니다. 자바 스크립트를 사용하여 일부 작업을 수행하는 데 사용되는 간단한 버튼입니다. 제출은 기본적으로 사용자가 제출 버튼을 클릭 할 때마다 양식을 제출하는 버튼입니다.

Answer 4

IE 8은 실제로 제출 또는 버튼과 마주 치는 첫 번째 버튼을 사용합니다. 입력 유형을 작성하여 원하는 것을 쉽게 표시하는 대신 페이지의 순서를 제출하는 것이 실제로 중요합니다.

Answer 5

<input type="button">은 양식 내에서뿐만 아니라 어디에서나 사용할 수 있으며 양식이있는 경우 양식을 제출하지 않습니다. Javascript에 훨씬 더 적합합니다.

<input type="submit">은 양식에서만 사용해야하며 지정된 URL로 요청 (GET 또는 POST)을 보냅니다. 그들은 이 아닌을 HTML 장소에 넣어야합니다.

Answer 6

W3C는

버튼없이 기본 동작 버튼의 모든 종류에 대한 일반적인 클래스로 볼 수있는 버튼 요소에 대한 사양에, 그것을 명확하게. 그것은 또한 유형의 이름을 입력은 또한 다른 형태의 이름 필드와 함께 제출됩니다 "제출"= 언급해야한다

W3C

Answer 7

동안 이름을 입력 유형 = "버튼"하지 않습니다. 명명 된 입력 name=submit1이 제출 얻을 것이다 동안 다른 단어와

은 아래의 예에서 이름을 입력 name=button1 제출하지 것입니다.

샘플 HTML 양식 (index.html을) :

<form action="checkout.php" method="POST"> 

    <!-- this won't get submitted despite being named --> 
    <input type="button" name="button1" value="a button"> 

    <!-- this one does; so the input's TYPE is important! --> 
    <input type="submit" name="submit1" value="a submit button"> 

</form> 

PHP 스크립트 (checkout.php) 위의 양식의 작업 처리 :하여 로컬 컴퓨터에 위의

<?php var_dump($_POST); ?> 

테스트/tmp/test /라는 폴더에 두 개의 파일을 생성 한 다음 쉘에서 내장 PHP 웹 서버를 실행합니다.

php -S localhost:3000 -t /tmp/test/ 

http://localhost:3000에서 브라우저를 열고 직접 확인하십시오.

왜 우리는 이름이 지정된 버튼을 제출해야합니까? 백엔드 스크립트에 따라 다릅니다. 예를 들어, WooCommerce WordPress 플러그인은 Place Order이라는 이름의 버튼이 제출되지 않는 한 Checkout 페이지를 처리하지 않습니다. 유형을 에서, 으로 변경하면이 버튼이 전송되지 않으므로 Checkout 양식이 처리되지 않습니다.

이것은 아마도 작은 세부 사항 일 테지만, 악마는 세부 사항에 있습니다.

Answer 8

type='Submit'은 전달로 설정되어 있습니다. & BACK-END (PHP, .NET 등)의 값을 가져옵니다. type='button'은 정상적인 버튼 동작을 반영합니다.