본문 바로가기
Source Files/WEB

[Web][Front-End] 회원가입 만들기

HTML/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
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
<!DOCTYPE html>
<html>
    <head>
         <title>setInterval 메소드</title>
        <script language="javascript"
             function previewString(){
                 var objResult = document.getElementById("result");
                 var objText = document.getElementById("tbString");
                 var objFontColor = document.getElementById("fontColor");
                 var objFontSize = document.getElementById("fontSize");
                 var objOptions = document.getElementsByName("fontOptions");
                 var targetString = objText.value;
 
 
             targetString = targetString.fontcolor(
                     objFontColor.options[objFontColor.selectedIndex].value
                 );
 
             targetString = targetString.fontsize(
                     objFontSize.options[objFontSize.selectedIndex].value
                 );
 
             if(objOptions[0].checked){
                 targetString = targetString.strike();
             }
             if(objOptions[1].checked){
                 targetString = targetString.big();
             } 
             if(objOptions[2].checked){
                 targetString = targetString.small();
             }
             if(objOptions[3].checked){
                 targetString = targetString.bold();
             }
             if(objOptions[4].checked){
                 targetString = targetString.italics();
             }
             if(objOptions[5].checked){
                 targetString = targetString.sup();
             }
             if(objOptions[6].checked){
                 targetString = targetString.sub();
             }
             if(objOptions[7].checked){
                 targetString = targetString.toLowerCase();
             }
             if(objOptions[8].checked){
                 targetString = targetString.toUpperCase();
 
             }
 
             objResult.innerHTML = targetString;
 
             }
         </script>
         </head>
         <body>
         <p>
             <input type="text" id="tbString">
             <input type="button" value="미리보기"
                    onclick="previewString()">
             <br>
 
             색상: 
             <select id="fontColor">
                 <option value="red">빨강</option>
                 <option value="blue">파랑</option>
                 <option value="yellow">노랑</option>
             </select>
             <br>
 
             크기:
             <select id="fontSize">
                 <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>
             </select>
             <br>
 
             <input type="checkbox" name="fontOptions">취소선
             <input type="checkbox" name="fontOptions">크게
             <input type="checkbox" name="fontOptions">작게
             <input type="checkbox" name="fontOptions">두껍게
             <input type="checkbox" name="fontOptions">기울임
             <br>
             <input type="checkbox" name="fontOptions">위첨자
             <input type="checkbox" name="fontOptions">아래첨자
             <input type="checkbox" name="fontOptions">소문자로
             <input type="checkbox" name="fontOptions">대문자로
             <br>
             </p>
             <span id="result"> </span>
    </body>
</html>
cs


'Source Files > WEB' 카테고리의 다른 글

[Web] JQuery/유효성 검사/ 회원가입 만들기  (3) 2018.04.14