[HTML-03] Link, CheckBox, Radio, Form

Form

• link의 목적이 있다.
• Javascript에 접근 가능하다.

 

Tag에 값을 전달시 attribute

• id : 현 페이지에서 하나만 인식. Javascript 접근
• class : 현 페이지에서 여러가지를 인식. CSS에서 사용
• name : 주로 값을 전달 시에 사용한다.

 

Input 태그의 종류

<!-- input : 입력 -->
date : <input type="date" name="date">
<br><br>
range : <input type="range" max="10" min="0">
<br><br>
search : <input type="search">
<br><br>
color : <input type="color" value="#ffff00">
<br><br>

 

<form action="NewFile.jsp">
	아이디 : <input type="text" name="id" value="" placeholder="아이디"><br> 
	패스워드 : <input type="password" name="pwd" placeholder="패스워드"><br> 
	<input type="submit" value="이동">
</form>

→ JSP에 id='입력한값'&pwd='입력한값' 형태로 전달된다.

<%
String id = request.getParameter("id");
String pwd = request.getParameter("pwd");

System.out.println("id: " + id);
System.out.println("pwd: " + pwd);
%>

→ 값 받아오기 가능!

 

<form action="NewFile1.jsp">
	<input type="checkbox" name="hobby" value="패션" checked="checked">패션 
	<input type="checkbox" name="hobby" value="음악"> 음악감상 
	<input type="checkbox" name="hobby" value="게임"> 게임
		
		
	<br><br>
		
	Radio <br>
	<input type="radio" name = "car" value="benz" checked="checked"> 벤츠
	<input type="radio" name = "car" value="bmw"> BMW
	<input type="radio" name = "car" value="saab"> 사브
		
	<br><br>
	<input type="submit" value="전송">
	<br><br>
		
</form>

• Checkbox는 중복 선택 가능하다
• Radio에 name을 동일하게 설정하면 중복 선택 불가능하다
• Form을 이용하여 jsp로 데이터 전송이 가능하다.

<%
String hobby[] = request.getParameterValues("hobby");
for (int i = 0; i < hobby.length; i++) {
	System.out.println(hobby[i]);
}

String car = request.getParameter("car");
System.out.println(car);
%>

→ 값 받아오기 가능!

 

<video width=400 controls="controls">
	<source src="mov_bbb.mp4" type="video/mp4">
</video>

<video> 태그 활용하여 video 출력도 가능!