[JavaScript] 라디오버튼 클릭시 원하는 배경색으로 바꾸기
- Web/JavaScript
- 2018. 7. 7.
이번 포스팅에서는 자바스크립트로 배경색을 바꿔보는 방법에 대해 알아보도록 하겠습니다. document.bgColor 함수를 활용해 배경색을 지정해줄 수 있습니다. 예제를 보시면 바로 이해하실 수 있으실겁니다. 이 예제를 응용해 다양하게 활용해보세요. 예제는 라디오버튼에 Value값을 자바스크립트로 넘겨줘서 배경색을 바꾸는 방식입니다.
라디오버튼 클릭시 원하는 배경색으로 바꾸기 예제
<%@ page language="java" contentType="text/html; charset=EUC-KR"
pageEncoding="EUC-KR"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta charset="EUC-KR">
<title>배경색 바꾸기</title>
<script language = "javascript">
function changeBg(color){
document.bgColor = color;
}
</script>
</head>
<body>
<input type = "radio" name="bgColor" value = "yellow" onclick="changeBg(this.value)">노란색<br>
<input type = "radio" name="bgColor" value = "green" onclick="changeBg(this.value)">녹색<br>
<input type = "radio" name="bgColor" value = "blue" onclick="changeBg(this.value)">파란색<br>
<input type = "radio" name="bgColor" value = "red" onclick="changeBg(this.value)">빨간색<br>
</body>
</html>
실행결과
'Web > JavaScript' 카테고리의 다른 글
| [JavaScript] 방문할때마다 랜덤으로 변하는 이미지 구현하기 (2) | 2018.07.09 |
|---|---|
| [JavaScript] 동적으로 테이블 만들기 (0) | 2018.07.08 |
| [JavaScript] Alert(경고창), Prompt(입력창), Confirm(선택창) (2) | 2018.07.06 |
| [JavaScript] Span태그의 속성(글꼴,색상,크기,스타일) 변경하기 (0) | 2018.07.05 |