반응형
자바스크립트(javascript) Button(버튼) 객체의 간단예제 (라디오버튼)
Button 객체는 우리가 명령을 수행하고자 할 때 가장 일반적으로 사용하는 버튼 중 하나이다.
일반적으로는 클릭이라는 이벤트로 많은 일을 하게 된다. 보통 자바스크립트를 보면 onClick이라는 이벤트 핸들러에 대해서 많이 보일 것이다.
이번 예제에서는 버튼을 클릭했을 때 발생하는 이벤트 핸들러에 대해서 살펴보도록 하자.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 | <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8" /> <title>onClick 이벤트 핸들러를 이용한 예제</title> <script> function rbclick(button){ alert(button.value+"을 눌렀군요.") } </script> </head> <body> <h2>좋아하는 계절을 눌러주세요.</h2> <form> <!--입력형태인 라디오버튼을 생성했다. 라디오 버튼을 클릭했을 때 몇 번의 라디오 버튼을 클릭했는지 보여준다.--> <input type="radio" value="봄" onclick="rbclick(this)">봄 <input type="radio" value="여름" onclick="rbclick(this)">여름 <input type="radio" value="가을" onclick="rbclick(this)">가을 <input type="radio" value="겨울" onclick="rbclick(this)">겨울 </form> </body> </html> | cs |
▲ 라디오버튼 클릭시 나타나는 메시지이다.
반응형
'이전 게시글 > 컴퓨터#웹 Jv.Script' 카테고리의 다른 글
| 자바스크립트 FileUpload(파일업로드) 객체의 뜻과 간단예제 (0) | 2016.06.05 |
|---|---|
| 자바스크립트 Checkbox(체크박스) 객체 뜻과 속성과 간단예제 (0) | 2016.06.05 |
| 자바스크립트 Form 태그, 메소드, 핸들러 예제 (0) | 2016.05.15 |
| 자바스크립트 Form 객체의 태그와 속성, 메소드 (0) | 2016.05.15 |
| 자바스크립트 navigator 브라우저의 정보와 버전 알아보기 간단예제 (0) | 2016.05.01 |
