'Code'에 해당되는 글 161건
-
예제_회원가입2019.06.20
-
예제_push,pop2019.06.20
-
예제_input type 활용2019.06.20
-
예제_계산기2019.06.20
-
JAVASCRIPT 예제_prompt, confirm2019.06.20
-
JAVASCRIPT 예제_오른쪽마우스 막기, 스크롤 금지2019.06.20
-
JAVASCRIPT 예제_바뀌는 이미지2019.06.20
-
JAVASCRIPT 예제_현재 시간 출력(setInterval)2019.06.20
-
JAVASCRIPT2019.06.20
-
JSP 예제_현재 시간 출력2019.06.20
예제_회원가입
반응형
|
1
2
3
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
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
|
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>무제 문서</title>
<style>
table td, th{ border-bottom:1px solid;border-bottom-color:#999;}
table tr {height:35px;}
</style>
<script src = "script.js">
</script>
</head>
<body>
<center>
<form name= "join" method="get">
<table width="60%">
<tr bgcolor="#CCFFFF">
<th colspan="2">회원 기본 정보</th>
</tr>
<tr>
<td>아이디 : </td>
<td><input type="text" maxlength="12" id="id" min="4" size="12" /> 4~12자의 영문 대소문자와 숫자로만 입력</td>
</tr>
<tr>
<td>비밀번호 : </td>
<td><input type="password" maxlength="12" id="password" min="4" size="12" /> 4~12자의 영문 대소문자와 숫자로만 입력</td>
</tr>
<tr>
<td>비밀번호 확인 : </td>
<td><input type="password" maxlength="12" id="checkpw" min="4" size="12" /></td>
</tr>
<tr>
<td>메일 주소 : </td>
</tr>
<tr>
<td>이름 : </td>
<td><input type="text" id="name" size="25" /></td>
</tr>
<tr bgcolor="#CCFFFF">
<th colspan="2">개인 신상 정보</th>
</tr>
<tr>
<td>주민등록번호 : </td>
<td><input type="text" id= "jumin" maxlength="13" size="15" onkeypress="checkJumin()"/> 예)1234561234567</td>
</tr>
<tr>
<td>생일 : </td>
<td>
<input type="text" id="year" size = "4"> 년
<select name="getBDayMonth" id="getBDayMonth" size="1">
<option value=1>1</option>
<option value=2>2</option>
<option value=3>3</option>
<option value=4>4</option>
<option value=5>5</option>
<option value=6>6</option>
<option value=7>7</option>
<option value=8>8</option>
<option value=9>9</option>
<option value=10>10</option>
<option value=11>11</option>
<option value=12>12</option>
</select>월
<select name="getBDayDay" size="1">
<option value=1 >1</option>
<option value=2>2</option>
<option value=3>3</option>
<option value=4>4</option>
<option value=5>5</option>
<option value=6>6</option>
<option value=7>7</option>
<option value=8>8</option>
<option value=9>9</option>
<option value=10>10</option>
<option value=11>11</option>
<option value=12>12</option>
<option value=13>13</option>
<option value=14>14</option>
<option value=15>15</option>
<option value=16>16</option>
<option value=17>17</option>
<option value=18>18</option>
<option value=19>19</option>
<option value=20>20</option>
<option value=21>21</option>
<option value=22>22</option>
<option value=23>23</option>
<option value=24>24</option>
<option value=25>25</option>
<option value=26>26</option>
<option value=27>27</option>
<option value=28>28</option>
<option value=29>29</option>
<option value=30>30</option>
<option value=31>31</option>
</select>일
</td>
</tr>
</td>
</tr>
<tr>
<td>관심분야 확인 : </td>
<td><input type="checkbox" name="hobby" value="computer"/>컴퓨터
<input type="checkbox" name="hobby" value="internet"/>인터넷
<input type="checkbox" name="hobby" value="travel"/>여행
<input type="checkbox" name="hobby" value="movie"/>영화감상
<input type="checkbox" name="hobby" value="music"/>음악감상
</td>
</tr>
<tr>
<td>자기소개 : </td>
<td><textarea id = "introduce" cols="50" rows="5"></textarea>
</td>
</tr>
</table>
<br /><br />
<input type="button" onclick = "checking()" value="회원 가입"/>
<input type="reset" value="초기화" />
</form>
</center>
</body>
</html>
http://colorscripter.com/info#e" target="_blank" style="color:#4f4f4f; text-decoration:none">Colored by Color Scripter
|
|
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
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
|
var check = /^[a-zA-Z0-9]{4,12}$/; //영문자 소문자, 대문자 사용, 0-9까지 숫자 허용, 문자는 4자리에서 12자리 까지만
var emailcheck = /^[0-9a-zA-Z]*@[0-9a-zA-Z]*.[a-zA-Z]{2,3}$/; //영문자 소문자, 대문자 사용, 0-9까지 숫자 허용,@, . 필수, i는 대소문자 상관 없음
var namecheck = /^[가-힣]{2,6}$/; //한글 가 부터 힇까지 사용 가능하고 2-6자리 까지만
function checking(){
var id = document.getElementById("id");
var pw = document.getElementById("password");
var checkpw = document.getElementById("checkpw");
var email = document.getElementById("email");
var name = document.getElementById("name");
var jumin = document.getElementById("jumin");
var hobby = document.getElementsByName("hobby");
var introduce = document.getElementById("introduce");
var year = document.getElementById("year");
if(!check.test(id.value)) { alert("아이디는 4~12자의 영문 대소문자와 숫자로만 입력");id.value = "";id.focus(); return false;} //사용자가 입력한 id가 정규식 만족 안할 때 alert로 알려주고 포커스 주고, return으로 함수 종료
if(!check.test(pw.value)) { alert("비밀번호는 4~12자의 영문 대소문자와 숫자로만 입력");pw.value = "";pw.focus();return false;} //사용자가 입력한 pw가 정규식 만족 안할 때 alert로 알려주고 포커스 주고, return으로 함수 종료
if (id.value==pw.value){alert("아이디와 비밀번호는 달라야합니다. 다시 설정해주세요."); pw.focus(); return false;} //사용자가 입력한 id와 pw가 같을 시 다시 입력하도록
if(pw.value!= checkpw.value) { alert("비밀번호와 비밀번호 확인이 일치하지 않습니다.");checkpw.value="";checkpw.focus();return false;} //사용자가 입력한 checkpw가 비밀번호와 일치 안할 때 alert로 알려주고 포커스 주고, return으로 함수 종료
if(!emailcheck.test(email.value)) { alert("이메일이 일치하지 않습니다.");email.value="";email.focus();return false;} //사용자가 입력한 email가 정규식 만족 안할 때 alert로 알려주고 포커스 주고, return으로 함수 종료
if(!namecheck.test(name.value)) { alert("이름을 다시 입력하세요.");name.value="";name.focus();return false;} //사용자가 입력한 name가 정규식 만족 안할 때 alert로 알려주고 포커스 주고, return으로 함수 종료
if(jumin.value == ""을 || jumin.value.length != 13){ alert("주민번호를 입력해주세요"); jumin.focus();return false;} //사용자가 입력한 주민번호가 입력 안될 시 alert로 알려주고 포커스 주고, return으로 함수 종료
if(year.value == ""){ alert("생년월일을 입력해주세요"); year.focus();return false;} //사용자가 입력한 주민번호가 입력 안될 시 alert로 알려주고 포커스 주고, return으로 함수 종료
if(!hobby[0].checked &&!hobby[1].checked &&!hobby[2].checked && !hobby[3].checked &&!hobby[4].checked ){ //사용자가 관심 분야 선택하지 않았을 때 alert로 알려주고 return으로 함수 종료
alert("관심분야를 선택하세요.");return false;
}
if(introduce.value==""){alert("자기소개 입력하세요");introduce.focus();introduce.value="";return false;} //사용자가 자기소개 입력하지 않았을 때 alert로 알려주고 return으로 함수 종료
}
function checkJumin(){ //사용자 주민번호 입력 시 호출되는 함수
var jumin = document.getElementById("jumin");
var year = document.getElementById("year");
var arr=new Array(13);
var M=11 - (((arr[0] * 2) + (arr[1] * 3) + (arr[2] * 4) + (arr[3] * 5) + (arr[4] * 6) + (arr[5] * 7) + (arr[6] * 8) + (arr[7] * 9) + (arr[8] * 2) + (arr[9] * 3) + (arr[10] * 4) + (arr[11] * 5)) % 11);
if (M > 9){
M -= 10;
}
if(M == arr[12]){ //주민번호 바를 때
if(jumin.value.substring(6,7) == 3 ||jumin.value.substring(6,7) == 4 )year.value = 2000 + y; //뒷 번호 3,4로 시작할 경우 2000년 생으로
if(m>0 && m<13) {
if(d>0 && d<32)
else { //계산 한 값이 주민번호 마지막 번호와 일치하지 않을 때
alert("잘못된 주민번호 입니다. 다시 입력해 주세요");
return false;
}
} else { //계산 한 값이 주민번호 마지막 번호와 일치하지 않을 때
alert("잘못된 주민번호 입니다. 다시 입력해 주세요");
return false;
}
}
else { //계산 한 값이 주민번호 마지막 번호와 일치하지 않을 때
alert("잘못된 주민번호 입니다. 다시 입력해 주세요");
return false;
}
}
}
http://colorscripter.com/info#e" target="_blank" style="color:#4f4f4f; text-decoration:none">Colored by Color Scripter
|
반응형
'Code > HTML & CSS & JAVASCRIPT' 카테고리의 다른 글
| GET/POST 데이터 디코딩 (0) | 2019.06.20 |
|---|---|
| 쿠키와 세션 (0) | 2019.06.20 |
| 예제_push,pop (0) | 2019.06.20 |
| 예제_input type 활용 (0) | 2019.06.20 |
| 예제_계산기 (0) | 2019.06.20 |
예제_push,pop
반응형
|
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
60
61
62
63
64
65
66
|
<html>
<head>
<title>Array 객체 다루기</title>
<style type="text/css">
input {
width:150px;
}
</style>
<script language="javascript">
var objArray = new Array();
function printArray() {
var objResult = document.getElementById("result");
var objItem = document.getElementById("item");
objResult.innerText = objArray.join(",");
objItem.value= "";
objItem.focus();
}
function doPush() {
var objItem = document.getElementById("item");
objArray.push(objItem.value);
printArray();
}
function doShift() {
var objValue = objArray.shift();
printArray();
alert("꺼내온 값은 " + objValue + "입니다.");
}
function doPop() {
var objValue = objArray.pop();
printArray();
alert("꺼내온 값은 " + objValue + "입니다.");
}
function doReverse() {
objArray = objArray.reverse();
printArray();
}
function doSort() {
objArray = objArray.sort(function(a, b){ return a-b; });
printArray();
}
</script>
</head>
<body>
<input type="text" id="item">
<input type="button" value="배열에 추가하기"
onclick="doPush()"><br>
현재 배열의 값:
<span id="result"></span><br><br>
<input type="button" value="Shift로 꺼내기"
onclick="doShift()">
<input type="button" value="Pop으로 꺼내기"
onclick="doPop()"><br>
<input type="button" value="Reverse로 뒤집기"
onclick="doReverse()">
<input type="button" value="Sort로 정렬하기"
onclick="doSort()">
</body>
</html>
http://colorscripter.com/info#e" target="_blank" style="color:#4f4f4f; text-decoration:none">Colored by Color Scripter
|
반응형
'Code > HTML & CSS & JAVASCRIPT' 카테고리의 다른 글
| 쿠키와 세션 (0) | 2019.06.20 |
|---|---|
| 예제_회원가입 (0) | 2019.06.20 |
| 예제_input type 활용 (0) | 2019.06.20 |
| 예제_계산기 (0) | 2019.06.20 |
| JAVASCRIPT 예제_prompt, confirm (0) | 2019.06.20 |
예제_input type 활용
반응형
|
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
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
|
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
<script language="javascript">
function displayText(){
var objresult = document.getElementById("display");
var objtext = document.getElementById("toString");
var objcolor = document.getElementById("colorSelect");
var objsize = document.getElementById("sizeSelect");
var objoption = document.getElementsByName("type"); //복수 s **, name으로 값 가져옴
target = target.fontcolor(objcolor.options[objcolor.selectedIndex].value);
target = target.fontsize(objsize.options[objsize.selectedIndex].value);
if(objoption[0].checked){
target = target.strike();
}if(objoption[1].checked){
target = target.big();
}if(objoption[2].checked){
target = target.small();
}if(objoption[3].checked){
target = target.bold();
}if(objoption[4].checked){
target = target.italics();
}if(objoption[5].checked){
target = target.sub();
}if(objoption[6].checked){
target = target.sub();
}if(objoption[7].checked){
target = target.toLowerCase();
}if(objoption[8].checked){
target = target.toUpperCase();
}
objresult.innerHTML = target;
}
</script>
</HEAD>
<BODY>
<center>
<br><br><br>
<input type="text" size="30" id = "toString">
<button name = "pre" onClick="displayText()">미리보기</button><br><br>
색상
<select id= "colorSelect">
<option value="red">빨강</option>
<option value="green">초록</option>
<option value="blue">파랑</option>
<option value="black">검정</option>
</select>
크기 :
<select id= "sizeSelect">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="4">5</option>
<option value="4">6</option>
</select><br><br>
<input type="checkbox" name="type"/> 취소선
<input type="checkbox" name="type"/> 크게
<input type="checkbox" name="type"/> 작게
<input type="checkbox" name="type"/> 두껍게
<input type="checkbox" name="type"/> 기울임
<br>
<input type="checkbox" name="type"/> 위첨자
<input type="checkbox" name="type"/> 아래첨자
<input type="checkbox" name="type"/> 소문자
<input type="checkbox" name="type"/> 대문자
<br><br>
<span id = "display" ></span>
<center>
</BODY>
</HTML>
http://colorscripter.com/info#e" target="_blank" style="color:#4f4f4f; text-decoration:none">Colored by Color Scripter
|
반응형
'Code > HTML & CSS & JAVASCRIPT' 카테고리의 다른 글
| 예제_회원가입 (0) | 2019.06.20 |
|---|---|
| 예제_push,pop (0) | 2019.06.20 |
| 예제_계산기 (0) | 2019.06.20 |
| JAVASCRIPT 예제_prompt, confirm (0) | 2019.06.20 |
| JAVASCRIPT 예제_오른쪽마우스 막기, 스크롤 금지 (0) | 2019.06.20 |
예제_계산기
반응형
|
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
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
|
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> 계산기 </TITLE>
<style>
caption {font-size:60px; margin-bottom:20px;}
table td input {font-size:20px; background:white; width:100%;height:50px;}
table td {width:100px;}
.numcolor {background-color:#8CC2FA; color:white;}
.calcolor {background-color:#1278B3; color:white;}
#num {text-align:right;}
</style>
<script language="javascript">
var num1=0;
var num2=0;
var state;
var result;
function inputNum(a){
document.getElementById("num").value +=a;
}
function change(){
var pm = document.getElementById("num").value;
if(pm > 0) document.getElementById("num").value = -pm;
}
function calcul(a){
num1 = document.getElementById("num").value;
if(a == "pow") {
state = "pow";
document.getElementById("num").value=null;
}
if(a == "sin") {
state = "sin";
result = Math.sin(num1);
document.getElementById("num").value = result;}
if(a == "cos") {
state = "cos";
result = Math.cos(num1);
document.getElementById("num").value = result;}
if(a == "tan") {
state = "tan";
result = Math.tan(num1);
document.getElementById("num").value = result;}
if(a=="sum"){
state = "sum";
document.getElementById("num").value=null;
}
if(a=="minus"){
state = "minus";
document.getElementById("num").value=null;
}
if(a=="mul"){
state = "mul";
document.getElementById("num").value=null;
}
if(a=="div"){
state = "div";
document.getElementById("num").value=null;
}
}
function end(){
num2 = document.getElementById("num").value;
if(state == "pow") result = Math.pow(num1,num2);
if(state == "sum") result = Number(num1)+Number(num2);
if(state == "minus") result = num1 - num2;
if(state == "mul") result = num1 * num2;
if(state == "div") result = num1 / num2;
document.getElementById("num").value = result;
}
</script>
</HEAD>
<BODY>
<form>
<center>
<table border="1px solid">
<caption>계산기</caption>
<tr>
<td colspan="5"><input type="text" id = "num" size="100%"></td>
</tr>
<tr>
<td colspan="3"><input type="reset" value="Clear" width="100%"></td>
<td colspan="2"><input type="button" value="=" onClick="end()"></td>
</tr>
<tr>
<td><input type="button" class="numcolor" onClick="inputNum(1)" value="1"></td>
<td><input type="button" class="numcolor" onClick="inputNum(2)" value="2"></td>
<td><input type="button" class="numcolor" onClick="inputNum(3)" value="3"></td>
<td><input type="button" value="+" class="calcolor" onClick="calcul('sum')"></td>
<td><input type="button" value="x^y" class="calcolor" onClick="calcul('pow')"></td>
</tr>
<tr>
<td><input type="button" class="numcolor" onClick="inputNum(4)" value="4"></td>
<td><input type="button" class="numcolor" onClick="inputNum(5)" value="5"></td>
<td><input type="button" class="numcolor" onClick="inputNum(6)" value="6"></td>
<td><input type="button" value="-" class="calcolor" onClick="calcul('minus')"></td>
<td><input type="button" value="sin" class="calcolor" onClick="calcul('sin')"></td>
</tr>
<tr>
<td><input type="button" class="numcolor" onClick="inputNum(7)" value="7"></td>
<td><input type="button" class="numcolor" onClick="inputNum(8)" value="8"></td>
<td><input type="button" class="numcolor" onClick="inputNum(9)" value="9"></td>
<td><input type="button" value="*" class="calcolor" onClick="calcul('mul')"></td>
<td><input type="button" value="cos" class="calcolor" onClick="calcul('cos')"></td>
</tr>
<tr>
<td><input type="button" class="numcolor" onClick="inputNum(0)" value="0"></td>
<td><input type="button" value="+/-" class="numcolor" onClick="change()"></td>
<td><input type="button" value="." class="numcolor" onClick="inputNum('.')"></td>
<td><input type="button" value="/" class="calcolor" onClick="calcul('div')"></td>
<td><input type="button" value="tan" class="calcolor" onClick="calcul('tan')"></td>
</tr>
</table>
</center>
</form>
</BODY>
</HTML>
http://colorscripter.com/info#e" target="_blank" style="color:#4f4f4f; text-decoration:none">Colored by Color Scripter
|
반응형
'Code > HTML & CSS & JAVASCRIPT' 카테고리의 다른 글
| 예제_push,pop (0) | 2019.06.20 |
|---|---|
| 예제_input type 활용 (0) | 2019.06.20 |
| JAVASCRIPT 예제_prompt, confirm (0) | 2019.06.20 |
| JAVASCRIPT 예제_오른쪽마우스 막기, 스크롤 금지 (0) | 2019.06.20 |
| JAVASCRIPT 예제_바뀌는 이미지 (0) | 2019.06.20 |
JAVASCRIPT 예제_prompt, confirm
반응형
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
|
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
<script language="javascript">
var userinput = prompt("당신의 이름은 무엇입니까",""); //입력한 데이터 리턴해줌
alert(userinput+"환영합니다.");
var result = confirm("2019년 이루고자 하는 것 이뤘나오?");
if(result)alert("수고했다");
else alert("힘내라");
</script>
</HEAD>
<BODY>
</BODY>
</HTML>
http://colorscripter.com/info#e" target="_blank" style="color:#4f4f4f; text-decoration:none">Colored by Color Scripter
|
반응형
'Code > HTML & CSS & JAVASCRIPT' 카테고리의 다른 글
| 예제_input type 활용 (0) | 2019.06.20 |
|---|---|
| 예제_계산기 (0) | 2019.06.20 |
| JAVASCRIPT 예제_오른쪽마우스 막기, 스크롤 금지 (0) | 2019.06.20 |
| JAVASCRIPT 예제_바뀌는 이미지 (0) | 2019.06.20 |
| JAVASCRIPT 예제_현재 시간 출력(setInterval) (0) | 2019.06.20 |
JAVASCRIPT 예제_오른쪽마우스 막기, 스크롤 금지
반응형
|
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
|
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
<script language="javascript">
function blockRightClick(){
alert("오른쪽 버튼을 사용할 수 없습니다.");
return false;
}
function blockSelect(){
alert("내용을 선택할 수 없습니다.");
return false;
}
</script>
</HEAD>
<BODY oncontextmenu = "return blockRightClick()" onselectstart="return blockSelect()" >
<h2> 마우스 오른쪽 버튼과 내용 선택 막기</h2>
<div>
마우스로 오른쪽 버튼 클릭하거나 드래그 불가
</div>
</BODY>
</HTML>
http://colorscripter.com/info#e" target="_blank" style="color:#4f4f4f; text-decoration:none">Colored by Color Scripter
|
반응형
'Code > HTML & CSS & JAVASCRIPT' 카테고리의 다른 글
| 예제_계산기 (0) | 2019.06.20 |
|---|---|
| JAVASCRIPT 예제_prompt, confirm (0) | 2019.06.20 |
| JAVASCRIPT 예제_바뀌는 이미지 (0) | 2019.06.20 |
| JAVASCRIPT 예제_현재 시간 출력(setInterval) (0) | 2019.06.20 |
| JAVASCRIPT (0) | 2019.06.20 |
JAVASCRIPT 예제_바뀌는 이미지
반응형
|
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
|
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
<script language="javascript">
var imgArray = new Array();
function showImage(){
var objImg = document.getElementById("introimg");
objImg.src = imgArray[imgNum];
}
</script>
</HEAD>
<BODY onload="showImage()">
</BODY>
</HTML>
http://colorscripter.com/info#e" target="_blank" style="color:#4f4f4f; text-decoration:none">Colored by Color Scripter
|
반응형
'Code > HTML & CSS & JAVASCRIPT' 카테고리의 다른 글
| JAVASCRIPT 예제_prompt, confirm (0) | 2019.06.20 |
|---|---|
| JAVASCRIPT 예제_오른쪽마우스 막기, 스크롤 금지 (0) | 2019.06.20 |
| JAVASCRIPT 예제_현재 시간 출력(setInterval) (0) | 2019.06.20 |
| JAVASCRIPT (0) | 2019.06.20 |
| CSS (0) | 2019.06.20 |
JAVASCRIPT 예제_현재 시간 출력(setInterval)
반응형
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
|
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<script language="javascript">
function now(){
var date =new Date();
var str = "현재 시간 :";
str += date.getHours()+"시 "+date.getMinutes()+"분 "+date.getSeconds()+"초 ";
document.getElementById("clock").innerHTML = str;
}
</script>
</HEAD>
<BODY onload="setInterval(now,1000)">
<span id = "clock"></span>
</BODY>
</HTML>
http://colorscripter.com/info#e" target="_blank" style="color:#4f4f4f; text-decoration:none">Colored by Color Scripter
|
반응형
'Code > HTML & CSS & JAVASCRIPT' 카테고리의 다른 글
| JAVASCRIPT 예제_오른쪽마우스 막기, 스크롤 금지 (0) | 2019.06.20 |
|---|---|
| JAVASCRIPT 예제_바뀌는 이미지 (0) | 2019.06.20 |
| JAVASCRIPT (0) | 2019.06.20 |
| CSS (0) | 2019.06.20 |
| HTML (0) | 2019.06.20 |
JAVASCRIPT
반응형
자바 스크립트
- html css만으로 표현하기 어렵거나 불가능한 작업을 하기 위해 만들어진 언어
- html 문서 내 작성/ 외부 파일에서 작성 후 불러올 수 있음
- head 안에
<script language = "javascript">
document.write("gg"); -> 내장 함수
</script>
- 변수 : var 변수명 = 초기값; var : 모든 타입 통합된 것이라 생각하면 됨
- 배열 : var 배열 = new Array(); 배열명.push(1); //값 넣기 배열명[0]=1;
- 예외처리 : try{ } catch{ }
- 함수 : function 함수명 (매개변수) {..실행코드} //리턴 타입 없다 -> var 가 통합된거기 때문ㅇㅔ 안쓰는것임
웹 브라우저
- window: 자바 스크립트가 제동하는 기본 객체
- alert("메시지");
- prompt("사용자에게 보내줄 메시지", 입력창에 미리 입력되어 있을 문자") : 질문에 대한 답변 받을 때
ex) 사용자의 이름 받아서 팝업 해줌
var userinput = prompt("당신의 이름은 무엇입니까",""); //입력한 데이터 리턴해줌
alert(userinput+"환영합니다.");
- confrim () : 확인 취소 두가지 대답 확인 할 수 있도록 하는 것
ex) var result = confirm("2019년 이루고자 하는 것 이뤘나오?");
if(result)alert("수고했다");
else alert("힘내라");
- 메소드 : window.open("팝업창주소", "이름", "속성"); -> 새로운 팝업 창 나타나도록 할 수 있다
- setTimeout(함수명, 시간) : 지정된 시간 지나면 특정 함수 실행
ex) var timer = setTimeout(sayhello,3000);
clearTimeout(timer); //타이머 번호 얻기
- setInterval(실행할 함수명, 시간) : 지정된 시간 지날때마다 함수를 계속 호출하는 함수
* setInterval : 일정한 시간마다 반복 - 시계 -> 반복할 때마다 함수 계속 호출되는 것임!!!!** 함수 안에 변수 넣게되면 초기화 되는 것과 같음
setTimeout : 특정 시간 됬을 대 동작 - 타이머
반응형
'Code > HTML & CSS & JAVASCRIPT' 카테고리의 다른 글
| JAVASCRIPT 예제_오른쪽마우스 막기, 스크롤 금지 (0) | 2019.06.20 |
|---|---|
| JAVASCRIPT 예제_바뀌는 이미지 (0) | 2019.06.20 |
| JAVASCRIPT 예제_현재 시간 출력(setInterval) (0) | 2019.06.20 |
| CSS (0) | 2019.06.20 |
| HTML (0) | 2019.06.20 |
JSP 예제_현재 시간 출력
반응형
JSP : HTML 에서 JAVA 사용하기 위한 언어
1. WebContent > ServletTest.jsp 파일 생성
2. <%@ %>안에 자바에서 필요한 import 추가
3. 자바 기능 사용하기 위해 <% %> 안에 구문 추
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
|
<%@ page language="java" contentType="text/html;charset=EUC-KR" pageEncoding="EUC-KR"%>
<%@ page import = "java.util.Calendar"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<%
Calendar c=Calendar.getInstance();
int hour=c.get(Calendar.HOUR_OF_DAY);
int minute=c.get(Calendar.MINUTE);
int second=c.get(Calendar.SECOND);
%>
<meta http-equiv="Content-Type" content="text/html;charset=EUC-KR">
<title>Servlet Test</title>
</head>
<body>
<H1>현재시각은 <%=hour %>시 <%=minute %>분 <%=second %>초 입니다.</H1>
</body>
</html>
http://colorscripter.com/info#e" target="_blank" style="color:#4f4f4f; text-decoration:none">Colored by Color Scripter
|
반응형
'Code > Servlet & JSP' 카테고리의 다른 글
| JSP 주석 (0) | 2019.06.20 |
|---|---|
| JSP 예제_계산기 (0) | 2019.06.20 |
| Servlet 예제_현재 시간 출력 (0) | 2019.06.20 |
| Servlet 구현 환경 (0) | 2019.06.20 |
| @Annotation (0) | 2019.06.20 |