336x280(권장), 300x250(권장), 250x250, 200x200 크기의 광고 코드만 넣을 수 있습니다.

안녕하세요.

 

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
<!-- jquery를 불러옵니다. jquery.com download 페이지를 참조해주세요 -->
<script src="//code.jquery.com/jquery-1.11.3.min.js"></script>
<script src="//code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
 
<script>
  $(document).ready(function() {
    $('#favorite').on('click', function(e) {
        var bookmarkURL = window.location.href;
        var bookmarkTitle = document.title;
        var triggerDefault = false;
 
        if (window.sidebar && window.sidebar.addPanel) {
            // Firefox version < 23
            window.sidebar.addPanel(bookmarkTitle, bookmarkURL, '');
        } else if ((window.sidebar && (navigator.userAgent.toLowerCase().indexOf('firefox') > -1)) || (window.opera && window.print)) {
            // Firefox version >= 23 and Opera Hotlist
            var $this = $(this);
            $this.attr('href', bookmarkURL);
            $this.attr('title', bookmarkTitle);
            $this.attr('rel', 'sidebar');
            $this.off(e);
            triggerDefault = true;
        } else if (window.external && ('AddFavorite' in window.external)) {
            // IE Favorite
            window.external.AddFavorite(bookmarkURL, bookmarkTitle);
        } else {
            // WebKit - Safari/Chrome
            alert((navigator.userAgent.toLowerCase().indexOf('mac') != -1 ? 'Cmd' : 'Ctrl') + '+D 키를 눌러 즐겨찾기에 등록하실 수 있습니다.');
        }
 
        return triggerDefault;
    });
});
</script>
 
<a href="#" id="favorite" title="즐겨찾기 등록">즐겨찾기</a>
 cs

 

감사합니다.

'JQUERY' 카테고리의 다른 글

JQUERY 간단한 selector 이렇게 하면 좋을거같아요  (0) 2016.07.06
JQUERY 불러오기 참 간단하죠~  (0) 2016.07.06
JQUERY url 주소가져오기  (0) 2015.11.30
JQUERY attribute 쓰기  (0) 2015.11.29
JQUERY 클릭 이벤트와 멀티 seleter사용하기  (0) 2015.11.29
336x280(권장), 300x250(권장), 250x250, 200x200 크기의 광고 코드만 넣을 수 있습니다.

안녕하세요.

이번엔 class, id, tag까지 이용한 Jquery예제를 보고 가실께요.

jquery불러오기에 비하면 소스가 늘긴 했지만,  설명도 다 달려있어서 별문제 없을거 같습니다.

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
<!-- jquery를 불러옵니다. jquery.com download 페이지를 참조해주세요 -->
<script src="//code.jquery.com/jquery-1.11.3.min.js"></script>
<script src="//code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
 
<script>
    //Jquery 화면을 불러오자마자 실행합니다.
    $(document).ready(function(){
        //class="testClass" 달린 버튼을 클릭했을때 합니다.
         $(".testClass").click(function(){
             alert("testClass 버튼클릭");
         });
         //id="testID" 달린 버튼을 클릭했을때 합니다.
         $("#testID").click(function(){
             alert("testID 버튼클릭");
         });
 
         //p태그가 소유하고 있는 내용을 클릭했을때 합니다.
         $(p).click(function(){
             alert("p태그 클릭");
         });    
    });
</script>
<input type="button" class="testClass"/>
<input type="button" id="testID"/>
<p>P태그</p>
 
 cs

 

감사합니다.

'JQUERY' 카테고리의 다른 글

북마크 JQUERY 사용하기  (0) 2016.07.08
JQUERY 불러오기 참 간단하죠~  (0) 2016.07.06
JQUERY url 주소가져오기  (0) 2015.11.30
JQUERY attribute 쓰기  (0) 2015.11.29
JQUERY 클릭 이벤트와 멀티 seleter사용하기  (0) 2015.11.29
336x280(권장), 300x250(권장), 250x250, 200x200 크기의 광고 코드만 넣을 수 있습니다.

안녕하세요.

 

이번엔 JQUERY 불러오기에 대해서 쓸께요. ㅎㅎ

JQUERY 이미 올린 것도 약간 있긴하지만.. 틈틈이 만들어서 올려드릴께요~.

 

1
2
3
4
5
6
7
8
9
10
11
<!-- jquery를 불러옵니다. jquery.com download 페이지를 참조해주세요 -->
<script src="//code.jquery.com/jquery-1.11.3.min.js"></script>
<script src="//code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
 
<script>
    //Jquery 화면을 불러오자마자 실행합니다.
    $(document).ready(function(){
          alert("시작하자마자 바로 실행!");  //javascript의 alert화면입니다.
    });
</script>
 
 cs

일단 설명은 주석으로 다 들어있어요~ ㅎㅎ

복사 붙여넣기 해서 보시면 아시겠지만, 하자마자 alert를 하나 띄워줍니다.

 

감사합니다.

'JQUERY' 카테고리의 다른 글

북마크 JQUERY 사용하기  (0) 2016.07.08
JQUERY 간단한 selector 이렇게 하면 좋을거같아요  (0) 2016.07.06
JQUERY url 주소가져오기  (0) 2015.11.30
JQUERY attribute 쓰기  (0) 2015.11.29
JQUERY 클릭 이벤트와 멀티 seleter사용하기  (0) 2015.11.29
336x280(권장), 300x250(권장), 250x250, 200x200 크기의 광고 코드만 넣을 수 있습니다.

안녕하세요. 이번엔 JQUERY에서 URL을 가져오는 방법을 알려드리겠습니다.

 

1
2
3
4
5
6
7
8
9
10
11
12
13
14
 
<!-- jquery를 불러옵니다. jquery.com download 페이지를 참조해주세요 -->
<script src="//code.jquery.com/jquery-1.11.3.min.js"></script>
<script src="//code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
 
<script>
    window.onload = function(){
        //전체주소
        console.log("url : "+$(location).attr('href'));
 
        //http:, localhost:port번호, index.html ?test=tttt 순으로 나누어져 있습니다.
        console.log("url : "+$(location).attr('protocol')+"//"+$(location).attr('host')+""+$(location).attr('pathname')+""+$(location).attr('search'));
    }
</script>
 cs

'JQUERY' 카테고리의 다른 글

북마크 JQUERY 사용하기  (0) 2016.07.08
JQUERY 간단한 selector 이렇게 하면 좋을거같아요  (0) 2016.07.06
JQUERY 불러오기 참 간단하죠~  (0) 2016.07.06
JQUERY attribute 쓰기  (0) 2015.11.29
JQUERY 클릭 이벤트와 멀티 seleter사용하기  (0) 2015.11.29
336x280(권장), 300x250(권장), 250x250, 200x200 크기의 광고 코드만 넣을 수 있습니다.

안녕하세요. 이번엔 html의 attribute를 이용해서 처리하는 방법을 알려드릴께요

 

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
<meta charset="utf-8"/>
<html>
<head>
<title>JDK의 블로그</title>
 
<!-- jquery를 불러옵니다. jquery.com download 페이지를 참조해주세요 -->
<script src="//code.jquery.com/jquery-1.11.3.min.js"></script>
<script src="//code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
 
<script language="javascript">
    $(document).ready(function(){
        //같은 event를 여러개로 지정했습니다.
        //input[id] input 태그중에서 ID속성을 가지고 있는지
        //span태그의 class=jdkddd인 경우만
        //span의 class가 og가 아닌경우
        //input class가 te로 시작하지 안는경우
        //input name가 kd로 포함하는 경우
        $("input[id], span[class='jdkddd'], span[class$='og'], input[class^='te'], span[name*='kd']").click(function(){
            alert("jdk's blog Jquery");
        });
    });
</script>
</head>
<body>
<input type='button' class='test' value='버튼'/>
 
<input type='button' id='test' value='버튼'/><br/>
<span class='jdkddd'>버튼1</span><br/>
<span name='kd'>버튼2$</span><br/>
<div>
    <span class='blog'>div 버튼안에span</span>
</div>
</body>
</html>
 cs

 

 

'JQUERY' 카테고리의 다른 글

북마크 JQUERY 사용하기  (0) 2016.07.08
JQUERY 간단한 selector 이렇게 하면 좋을거같아요  (0) 2016.07.06
JQUERY 불러오기 참 간단하죠~  (0) 2016.07.06
JQUERY url 주소가져오기  (0) 2015.11.30
JQUERY 클릭 이벤트와 멀티 seleter사용하기  (0) 2015.11.29
336x280(권장), 300x250(권장), 250x250, 200x200 크기의 광고 코드만 넣을 수 있습니다.

안녕하세요 jquery에서 seleter와 click이벤트에 대해서 알아보겠습니다.

 

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
<meta charset="utf-8"/>
<html>
<head>
<title>JDK의 블로그</title>
 
<!-- jquery를 불러옵니다. jquery.com download 페이지를 참조해주세요 -->
<script src="//code.jquery.com/jquery-1.11.3.min.js"></script>
<script src="//code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
 
<script language="javascript">
    $(document).ready(function(){
        //같은 event를 여러개로 지정했습니다.
        //#test는 ID가 test의 경우에 처리합니다.
        //.test는 Class가 test의 경우에 처리합니다.
        //span은 태그 이름이 span인 경우 처리합니다.
        //div.span은 div태그 밑에 span태그인 경우에 처리합니다.
        $("#test,.test,span,div.span").click(function(){
            alert("jdk's blog Jquery");
        });
    });
</script>
</head>
<body>
<input type='button' class='test' value='버튼'/>
 
<input type='button' id='test' value='버튼'/><br/>
<span>버튼</span><br/>
<div>
    <span>div 버튼안에span</span>
</div>
</body>
</html>
 cs

 

 

 

 

 

'JQUERY' 카테고리의 다른 글

북마크 JQUERY 사용하기  (0) 2016.07.08
JQUERY 간단한 selector 이렇게 하면 좋을거같아요  (0) 2016.07.06
JQUERY 불러오기 참 간단하죠~  (0) 2016.07.06
JQUERY url 주소가져오기  (0) 2015.11.30
JQUERY attribute 쓰기  (0) 2015.11.29

+ Recent posts

티스토리툴바