Computer >> 컴퓨터 >  >> 프로그래밍 >> HTML

HTML formtarget 속성 완벽 가이드 – 폼 제출 결과 표시 위치 지정하기

HTML의 formtarget 속성은 폼(form)을 제출한 후 서버로부터 받은 응답(response)이 어디에 표시될지를 지정하는 데 사용됩니다. 이 속성은 <form> 태그의 target 속성보다 우선하며(오버라이드), type="submit" 또는 type="image"인 입력 요소에서만 사용할 수 있다는 점에 유의해야 합니다.

formtarget 속성값 정리

formtarget 속성에 사용할 수 있는 값은 다음과 같습니다.

번호설명
1_blank응답이 새 창 또는 새 탭에 표시됩니다.
2_self기본값으로, 응답이 현재 프레임(같은 화면)에 표시됩니다.
3_parent응답이 부모 프레임(parent frame)에 표시됩니다.
4_top응답이 창 전체 본문(body)에 표시됩니다.
5framename응답이 지정된 이름을 가진 iframe에 표시됩니다.

사용 예제

아래 예제 코드를 실행하면 HTML에서 formtarget 속성을 사용하는 방법을 직접 확인할 수 있습니다. 일반 제출 버튼과 달리, formtarget="_blank"가 적용된 버튼을 클릭하면 폼 제출 결과가 새 창에서 열리는 것을 볼 수 있습니다.

<!DOCTYPE html>
<html>
   <head>
      <title>HTML formtarget attribute</title>
   </head>
   <body>
      <form action="/new.php" method="get">
         학생 이름<br><input type="text" name="name"/><br>
         학생 과목<br><input type="text" name="subject"/><br>
         <input type="submit" value="Submit">
         <input type="submit" formtarget="_blank" value="Submit (new window)">
      </form>
   </body>
</html>

위 코드에서 첫 번째 제출 버튼은 기본값(_self)에 따라 현재 페이지에 응답을 표시하고, 두 번째 버튼은 formtarget="_blank" 덕분에 새 창이나 새 탭에서 결과를 열어줍니다. 이처럼 하나의 폼 안에서도 버튼별로 서로 다른 표시 위치를 지정할 수 있어 활용도가 높습니다.