자바 스크립트 라디오 버튼 계산기
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59 |
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script type="text/javascript">
function calc_go(){
var select = document.getElementsByName("calc");
if (select[0].checked==true) {
var num1 = document.getElementById("num1").value;
var num2 = document.getElementById("num2").value;
var res = parseInt(num1)+parseInt(num2);
document.getElementById("res1").innerHTML=res;
}
else if (select[1].checked==true) {
var num1 = document.getElementById("num1").value;
var num2 = document.getElementById("num2").value;
var res = parseInt(num1)-parseInt(num2);
document.getElementById("res1").innerHTML=res;
}
else if (select[2].checked==true) {
var num1 = document.getElementById("num1").value;
var num2 = document.getElementById("num2").value;
var res = parseInt(num1)*parseInt(num2);
document.getElementById("res1").innerHTML=res;
}
else if (select[3].checked==true) {
var num1 = document.getElementById("num1").value;
var num2 = document.getElementById("num2").value;
var res = parseInt(num1)/parseInt(num2);
document.getElementById("res1").innerHTML=res;
}
}
</script>
</head>
<body>
<h2>계산기</h2>
<form>
<p>첫번째 수 : <input type="number" id="num1" name="num1"></p>
<p>두번째 수 : <input type="number" id="num2" name="num2"></p>
<input type="radio" name="calc" value="plus">덧셈
<input type="radio" name="calc" value="minus">뺄셈
<input type="radio" name="calc" value="mul">곱셈
<input type="radio" name="calc" value="div">나눗셈
<input type ="button" value="계산" onclick="calc_go()"/>
<hr/>
<h3>결과 :<span id="res1"></span></h3>
</form>
</body>
</html> |
cs |
코드 실행 화면
라디오버튼을 사용해서 계산기를 만들어봤습니다.
jswoo030@gmail.com 으로 질문을 보내시면 빠른 답변을 받으실 수 있습니다
'HTML│CSS│Java Script' 카테고리의 다른 글
| html 회원 정보 확인 예제 (0) | 2017.12.05 |
|---|---|
| html 회원가입 양식 (0) | 2017.12.05 |
| 자바 스크립트 배열 (0) | 2017.12.05 |
| 자바스크립트 (0) | 2017.12.04 |
| html 회원 가입 예제 코드 / form action / select / input (4) | 2017.12.04 |
댓글