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
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
 
 
<script type="text/javascript">
    
    //윈도우 하위 객체(BOM)    
    // - screen
    // - hitory
    // - location
    
    function test() {
        
        //screen 객체
        
        // - 현재 화면의 해상도
        //alert(screen.availWidth); //1440    
        //alert(screen.availHeight);// 860
        
        //팝업을 화면 가운데 띄어주세요.
        window.open("http://www.naver.com", "naver", "width=200,height=200, left=" + (screen.availWidth / 2 - 100) +", top=" + (screen.availHeight / 2 - 110))
    }
    
 
    function test2() {
        
        //location 객체
 
        // - 브라우저의 현재 위치와 관련된 행동
        //location.href = "URL";
        //location.href = "http://www.naver.com"; //페이지이동**
        location.href = "ex09.htm";
    }
    
    
    function test3() {
        
        //history
        
        // - 브라우저의 방문 기록을 관리
        //history.back(); //브라우저의 뒤로 가기 버튼
        //history.forward();
    }
    
    
    function test4() {
        
        //window - 대화상자**
        // 1. alert()
            //window.alert("메시지창");
        
        // 2. confirm()**
            //var result = confirm("메시지창");
            // 확인 : true
            // 취소 : false
            //alert(result);
        
            /* var result = confirm("정말 삭제하시겠습니까?");
            
            if(result) {
                //삭제업무.,
                alert("삭제했습니다.");
            } else {
                //취소업무.,
                alert("취소했습니다");
            } */
            
        // 3. prompt() (x)
            var name = prompt("이름을 입력하세요.", "");
            alert(name + "님 안녕하세요~");
        
        
        //window는 생략 가능
        //window.document.form1.btm1
        //window.document.getElementById("btm1")    
        
        //window.location.href = "";
        //window.history.back();
    }
    
    
</script>
 
 
</head>
<body>
 
 
    <!-- ex10.htm -->
 
 
 
    <input type="button" value="테스트" onclick="test();" />screen, 현재 해상도<br />    
    <input type="button" value="테스트2" onclick="test2();" />location, 페이지 이동<br />
    <input type="button" value="테스트3" onclick="test3();" />history, 뒤로(앞으로) 가기<br />
 
    <hr />
    <form method="POST" action="ex10Ok.jsp">
        이름 : <input type="text" /><br />
        나이 : <input type="text" /><br />
        <input type="submit" value="보내기" />
    </form>
        
    <hr />
    <input type="button" value="테스트4" onclick="test4();" /><br />
 
 
 
</body>
</html>
cs


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
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
</head>
<body>
 
 
    <!-- ex10Ok.jsp -->
    
    <!-- 
        
        ex10.htm -> (데이터 전송) -> ex10Ok.jsp
        : 문제 발생
        -> 알림 -> ex10.htm
    
    -->
    
    
    <script type="text/javascript">
        
        alert("데이터 입력 오류!!\n 다시 입력하세요.");
        
        
        //location & history 차이
        
        //location.href = "ex10.htm"; //항상 새로운 페이지를 요청 F5
        history.back();                  //이전의 상태를 기억
        
    </script>
 
 
</body>
</html>
 
cs


'WEB > JS' 카테고리의 다른 글

태그 조작  (0) 2016.01.22
태그 검색  (0) 2016.01.22
부모, 자식 찾기  (0) 2016.01.22
BOM / DOM 방식  (0) 2016.01.22
날짜시간 / 배열(array)  (0) 2016.01.22

+ Recent posts

티스토리툴바