AI가 만든 미리보기 버튼이 폼을 제출한다면: button의 type부터 확인하기
폼 안의 “미리보기” 버튼을 눌렀는데 제출이 실행된다면 버튼 글자보다 type 속성을 먼저 확인하세요. 일반적인 form에 연결된 button에서 type을 생략하면 기본 제출 동작이 적용됩니다. 목차 1. “미리보기”라는 글자가 동작을 정하지 않습니다 2. 세 가지 역할을 표로 정하기 3. 같은 연습 폼에서 한 항목씩 확인하기 4. 자주 묻는 질문 1. “미리보기”라는 글자가 동작을 정하지 않습니다 MDN은 button의 type으로 submit, reset, button을 설명합니다. 일반적인 폼 안에서 type이 생략된 버튼은 제출 버튼으로 동작할 수 있습니다. 폼 검증에서 제출이 막히는 경우도 있으므로, 눌렀을 때 화면이 바뀌지 않았다는 사실만으로 type이 올바르다고 판단하지 않습니다. <form> <button>미리보기</button> <button type="submit">제출</button> </form> 위 코드는 첫 버튼의 이름과 기본 역할이 어긋날 수 있는 예시입니다. 실제 개인정보나 운영 중인 신청서로 시험하기 전에 복사한 연습 화면에서 확인하는 편이 좋습니다. 2. 세 가지 역할을 표로 정하기 하려는 일 type의 기본 의미 함께 확인할 것 최종 제출 submit 제출 대상과 검증 조건 일반 클릭 동작 button 미리보기 등을 수행할 별도 처리 폼 값 되돌리기 reset 사용자가 입력한 값에 미치는 영향 <button type="button">미리보기</button> <button type="submit">제출</button> type="button"을 쓰면 그 자체의 기본 제출 동작은 없습니다. 그렇다고 미리보기 기능이 자동으로 생기지는 않습니다. 클릭을 처리하는 코드가 필요하고, 그 코드가 다시 제출을 호출하도록 작성돼 있다면 별도로 점검해야 합니다...