메뉴 건너뛰기

2016.09.21 18:25

jQuery Cookie

조회 수 6864 추천 수 0 댓글 0
?

단축키

Prev이전 문서

Next다음 문서

크게 작게 위로 아래로 댓글로 가기 인쇄
?

단축키

Prev이전 문서

Next다음 문서

크게 작게 위로 아래로 댓글로 가기 인쇄

쿠키값을 읽고, 쓰고, 삭제할 수 있는 단순하고 가벼운 jQuery plugin 이다.



설치

다운로드한 jquery.cookie.js 파일을 사이트의 /js 디렉토리에 저장했다면 아래와 같이 코드를 넣어준다. 아래 코드는 jQuery library를 소스상에 포함시킨 후에 추가해야 한다.


<script src="/js/jquery.cookie.js"></script>



사용법

$.cookie(the_cookie the_value , 쿠키옵션);

the_cookie : 쿠키

the_value : 쿠키값


1. 세션쿠키 생성

$.cookie('the_cookie', 'the_value');


2. 생성일로부터 7일후에 만료되는 쿠키를 생성

$.cookie('the_cookie', 'the_value', { expires: 7 });


3. 경로가 사이트 루트이고, 생성일로부터 7일후에 만료되는 쿠키 생성

$.cookie('the_cookie', 'the_value', { expires: 7, path: '/' });


4. 쿠키값 읽기

$.cookie('the_cookie');     // 'the_value' 값을 반환한다.

$.cookie('not_existing');    // 선언되지 않은 변수명을 적용하면 undefined 를 반환한다.


5. 모든 쿠키변수의 값을 읽기

모든 값이 json 형태로 반환된다.


$.cookie();    // { 'the_cookie' : 'the_value', ... }


6. 쿠키 삭제

$.removeCookie('the_cookie');    // 쿠키 'the_cookie' 를 삭제한다. 성공하면 true, 실패하면 false 를 반환한다.


$.removeCookie('the_cookie', { path: '/' });    // 동일한 경로를 갖는 쿠키들을 삭제한다.



설정

raw

쿠키값을 쓰거나 읽을때 기본적으로 encodeURIComponent/decodeURIComponent 를 이용해서 엔코딩/디코딩 처리를 한다. 엔코딩/디코딩 없이 쓰거나 읽기를 원하면 raw 속성에 true 를 설정한다.


$.cookie.raw = true;


json

Turn on automatic storage of JSON objects passed as the cookie value. Assumes JSON.stringify and JSON.parse


$.cookie.json = true;



쿠키옵션

expires

쿠키의 유효기간을 정의한다. 이 값을 지정하지 않으면 쿠키는 세션쿠키로 생성된다. 값은 생성 시점의 시간 또는 날짜를 기준으로 일수로 표시한다.


expires : 365


path

쿠키의 경로를 정의한다. 기본값은 쿠키를 생성한 페이지의 경로값이 된다.

If you want to make it available for instance across the entire domain use path: '/'.


domain

쿠키가 유효한 도메인을 지정한다. 기본값은 쿠키가 생성된 페이지의 도메인이다.


domain : 'example.com'


secure

이 값이 true 이면, 쿠키값을 전달하기 위해서 https 를 요구한다. 기본값은 false 이다.



변환

1. 쿠키값을 숫자로 반환하기 위한 예제

$.cookie('foo', '42');

$.cookie('foo', Number);    //반환되는 값은 숫자 42 가 된다.


2. escape()를 이용해서 엔코딩 된 쿠키값을 디코딩하기 위한 예제

$.cookie.raw = true;     // 기본 엔코딩/디코딩을 무시한다.

$.cookie('foo', unescape);    // 쿠키 foo 값을 반환할때 unescape() 를 이용해서 디코딩 해서 



사이트 

http://plugins.jquery.com/cookie/


  1. No Image 07Nov
    by
    2018/11/07 Views 81485 

    jquery timer, javascript countdown (타이머 예제)

  2. No Image 09Sep
    by
    2016/09/09 Views 8149 

    jquery selector / jquery 선택자 / 자주 사용하는 jquery selector 선택자 / selecter

  3. No Image 18Nov
    by
    2016/11/18 Views 6931 

    jQuery Selector (셀렉터)

  4. No Image 25Jul
    by
    2018/07/25 Views 2558 

    jQuery selectBox 컨트롤.

  5. No Image 17Nov
    by
    2016/11/17 Views 10046 

    jquery radio checked (라디오 버튼 값으로 선택), 검색 조건 초기 셋팅

  6. jQuery Quick API

  7. jQuery Plugin : Slider

  8. No Image 11Sep
    by
    2016/09/11 Views 6963 

    jquery function 생성

  9. No Image 17Nov
    by
    2016/11/17 Views 6857 

    jquery enter key event submit (jquery 엔터키 이벤트)

  10. jQuery datepicker 팝업창 사이즈 바꾸기

  11. jquery css div, li 리스트 선택한 메뉴 변경 출처: http://okkks.tistory.com/1062 [이건없지]

  12. No Image 21Sep
    by 조쉬
    2016/09/21 Views 6864 

    jQuery Cookie

  13. jQuery - 클릭이벤트 동적 처리하기($("").click(), on('click') 차이)

  14. jQuery - 드래그앤드롭(DragAndDrop)을 통한 파일 업로드

  15. jQuery - 드래그, 리사이즈 이벤트에 따른 영역 침범 막기

  16. No Image 06Sep
    by
    2018/09/06 Views 5330 

    jquery - select option 선택값 가져오기

  17. jQuery - radio, checkBox값 가져오기, 선택하기, 제어 등

  18. jQuery - checkbox 전체 선택, 해제 기능 및 단일 체크박스가 해제되었을때 전체 선택 해제 하기

  19. No Image 09Mar
    by
    2021/03/09 Views 1470 

    jQuery - ajaxSubmit 사용법 및 유의사항(페이지 리로드 현상)

  20. jQuery - ajax xhr을 활용한 파일 업로드 진행 상태 확인하기

Board Pagination Prev 1 2 3 4 5 6 7 8 9 Next
/ 9

하단 정보를 입력할 수 있습니다

© k2s0o1d4e0s2i1g5n. All Rights Reserved