Câu hỏi Làm cách nào để đặt / bỏ đặt cookie với jQuery?


Làm cách nào để đặt và bỏ đặt cookie bằng jQuery, ví dụ: tạo cookie có tên test và đặt giá trị thành 1?


1075
2017-09-22 08:09


gốc




Các câu trả lời:


Xem plugin:

https://github.com/carhartl/jquery-cookie

Sau đó bạn có thể làm:

$.cookie("test", 1);

Xóa:

$.removeCookie("test");

Ngoài ra, để đặt thời gian chờ của một số ngày nhất định (10 ở đây) trên cookie:

$.cookie("test", 1, { expires : 10 });

Nếu tùy chọn hết hạn bị bỏ qua, thì cookie sẽ trở thành cookie phiên và bị xóa khi trình duyệt thoát.

Để bao gồm tất cả các tùy chọn:

$.cookie("test", 1, {
   expires : 10,           // Expires in 10 days

   path    : '/',          // The value of the path attribute of the cookie
                           // (Default: path of page that created the cookie).

   domain  : 'jquery.com', // The value of the domain attribute of the cookie
                           // (Default: domain of page that created the cookie).

   secure  : true          // If set to true the secure attribute of the cookie
                           // will be set and the cookie transmission will
                           // require a secure protocol (defaults to false).
});

Để đọc lại giá trị của cookie:

var cookieValue = $.cookie("test");

Bạn có thể muốn chỉ định tham số đường dẫn nếu cookie được tạo trên một đường dẫn khác đến đường dẫn hiện tại:

var cookieValue = $.cookie("test", { path: '/foo' });

CẬP NHẬT (tháng 4 năm 2015):

Như đã nêu trong các ý kiến ​​dưới đây, nhóm làm việc trên các plugin ban đầu đã loại bỏ sự phụ thuộc của jQuery trong một dự án mới (https://github.com/js-cookie/js-cookie) có cùng chức năng và cú pháp chung như phiên bản jQuery. Rõ ràng các plugin ban đầu là không đi bất cứ nơi nào mặc dù.


1592
2017-09-22 08:11



từ thay đổi: "$ .removeCookie ('foo') để xóa cookie, sử dụng $ .cookie ('foo', null) hiện không còn được dùng nữa" - bogdan
@Kazar Tôi đã dành 6 giờ, không nghỉ giải lao. Cuối cùng tôi đã nhận ra vấn đề sáng nay. Tôi đang sử dụng tính năng này với phonegap, trên trang web nó hoạt động không có vấn đề gì, nhưng trên thiết bị, khi bạn cố gắng truy xuất cookie có JSON, nó đã là một đối tượng, vì vậy nếu bạn cố gắng JSON.parse nó, nó sẽ cung cấp lỗi phân tích cú pháp JSON. Giải quyết nó với một "nếu typeof x == 'string'" làm JSON.parse, khác, chỉ cần sử dụng đối tượng. 6 giờ chết tiệt tìm kiếm lỗi ở tất cả các địa điểm sai - Andrei Cristian Prodan
khi xóa cookie, hãy đảm bảo cũng đặt đường dẫn đến cùng một đường dẫn khi bạn đặt cookie ban đầu: $.removeCookie('nameofcookie', { path: '/' }); - LessQuesar
Đó là năm 2015 và chúng tôi vẫn nhận được hơn 2 nghìn lượt truy cập mỗi tuần trong kho lưu trữ jquery-cookie chỉ từ câu trả lời này. Một vài điều chúng ta có thể học hỏi từ đó: 1. cookie sẽ không chết sớm và 2. Mọi người vẫn google cho một "plugin jquery để cứu thế giới". jQuery là không cần thiết để xử lý cookie, jquery-cookie đang được đổi tên thành js-cookie (github.com/js-cookie/js-cookie) và phụ thuộc jquery đã được thực hiện tùy chọn trong phiên bản 1.5.0. Sẽ có một phiên bản 2.0.0 với rất nhiều thứ thú vị, đáng để xem và đóng góp, thx! - Fagner Brack
@ Kazar Chúng tôi không có kế hoạch di chuyển vật lý, có một lượng đáng kể lưu lượng truy cập tổng thể đến URL đó từ nhiều nguồn và Klaus là chủ sở hữu lịch sử của không gian tên "jquery-cookie". Không cần phải lo lắng về việc URL đó sẽ biến mất sớm. Nhưng tôi vẫn khuyến khích mọi người bắt đầu xem kho lưu trữ mới để cập nhật. - Fagner Brack


Không cần phải sử dụng jQuery đặc biệt để thao tác cookie.

Từ Chế độ quirks (bao gồm cả ký tự thoát)

function createCookie(name, value, days) {
    var expires;

    if (days) {
        var date = new Date();
        date.setTime(date.getTime() + (days * 24 * 60 * 60 * 1000));
        expires = "; expires=" + date.toGMTString();
    } else {
        expires = "";
    }
    document.cookie = encodeURIComponent(name) + "=" + encodeURIComponent(value) + expires + "; path=/";
}

function readCookie(name) {
    var nameEQ = encodeURIComponent(name) + "=";
    var ca = document.cookie.split(';');
    for (var i = 0; i < ca.length; i++) {
        var c = ca[i];
        while (c.charAt(0) === ' ')
            c = c.substring(1, c.length);
        if (c.indexOf(nameEQ) === 0)
            return decodeURIComponent(c.substring(nameEQ.length, c.length));
    }
    return null;
}

function eraseCookie(name) {
    createCookie(name, "", -1);
}

Hãy xem


393
2017-09-22 13:40



Hi Russ, điều tốt về cookie jquery là nó thoát dữ liệu - Svetoslav Marinov
@lordspace - Chỉ cần bọc giá trị trong window.escape / unescape để ghi / truy xuất giá trị cookie, tương ứng :) - Russ Cam
Bạn có thể tìm thấy mã cookie tốt hơn tại đây: developer.mozilla.org/en/DOM/document.cookie - SDC
plugin cookie jQuery đơn giản hơn rất nhiều - brauliobo
thay vì thoát hoặc unescape bạn có thể sử dụng encodeURI hoặc decodeURI - Rodislav Moldovan


<script type="text/javascript">
        function setCookie(key, value) {
            var expires = new Date();
            expires.setTime(expires.getTime() + (1 * 24 * 60 * 60 * 1000));
            document.cookie = key + '=' + value + ';expires=' + expires.toUTCString();
        }

        function getCookie(key) {
            var keyValue = document.cookie.match('(^|;) ?' + key + '=([^;]*)(;|$)');
            return keyValue ? keyValue[2] : null;
        }
</script>

Bạn có thể đặt cookie như

setCookie('test','1');

Bạn có thể lấy các cookie giống như

getCookie('test');

Hy vọng nó sẽ giúp cho ai đó :)

CHỈNH SỬA:

Nếu bạn muốn lưu đường dẫn cookie cho trang chủ một mình thì hãy làm như thế này

function setCookie(key, value) {
                var expires = new Date();
                expires.setTime(expires.getTime() + (1 * 24 * 60 * 60 * 1000));
                document.cookie = key + '=' + value +';path=/'+ ';expires=' + expires.toUTCString();
            }

Cảm ơn, vicky


110
2017-09-06 07:40



60 * 1000 = 60 giây 60 * (60 * 1000) = 60 phút là 1 giờ 24 * (60 * (60 * 1000)) = 1 ngày trong 24 giờ Hy vọng điều đó sẽ giúp ích. - Vignesh Pichamani
1 * 24 * 60 * 60 * 1000 tùy chỉnh 1 trong 1 ngày hoặc bạn có thể làm 365 - Vignesh Pichamani
Các chức năng tốt ... Nhưng tại sao chúng lại nằm trong một thẻ document.ready? - Dss
Điều này sẽ không hoạt động trong Safari hoặc IE đối với bất kỳ ký tự nào nằm ngoài phạm vi ASCII, chẳng hạn như é, 北, v.v. Ngoài ra, điều này sẽ không hoạt động đối với một số ký tự đặc biệt không được phép trong tên cookie hoặc giá trị cookie. Tôi khuyên bạn nên tham khảo sau đây: tools.ietf.org/html/rfc6265 - Fagner Brack
không có plugin mess - câu trả lời hay nhất !!! - Yordan Georgiev


Bạn có thể sử dụng plugin sẵn có tại đây ..

https://plugins.jquery.com/cookie/

và sau đó viết một cookie $.cookie("test", 1);

để truy cập cookie đã đặt $.cookie("test");


16
2017-09-22 08:43



có phiên bản mới hơn của plugin đó - Andrei Cristian Prodan
Nó đã được đổi tên thành github.com/js-cookie/js-cookie - Fagner Brack


Đây là mô-đun toàn cầu của tôi mà tôi sử dụng -

var Cookie = {   

   Create: function (name, value, days) {

       var expires = "";

        if (days) {
           var date = new Date();
           date.setTime(date.getTime() + (days * 24 * 60 * 60 * 1000));
           expires = "; expires=" + date.toGMTString();
       }

       document.cookie = name + "=" + value + expires + "; path=/";
   },

   Read: function (name) {

        var nameEQ = name + "=";
        var ca = document.cookie.split(";");

        for (var i = 0; i < ca.length; i++) {
            var c = ca[i];
            while (c.charAt(0) == " ") c = c.substring(1, c.length);
            if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length, c.length);
        }

        return null;
    },

    Erase: function (name) {

        Cookie.create(name, "", -1);
    }

};

10
2017-10-26 09:43





Hãy chắc chắn không làm điều gì đó như thế này:

var a = $.cookie("cart").split(",");

Sau đó, nếu cookie không tồn tại, trình gỡ lỗi sẽ trả về một số thông báo không hữu ích như ".cookie not a function".

Luôn khai báo trước, sau đó thực hiện tách sau khi kiểm tra null. Như thế này:

var a = $.cookie("cart");
if (a != null) {
    var aa = a.split(",");

8
2017-09-01 15:26



Mã mẫu chưa hoàn thành. Nó chỉ là một } bị thiếu hoặc có một số dòng mã bị thiếu? - Peter Mortensen
Nó chỉ là một singe} thiếu, nhưng rõ ràng bạn sẽ cần phải thêm nhiều dòng mã để tiếp tục những gì bạn muốn làm với việc chia nhỏ. - user890332


Một ví dụ đơn giản về cookie được đặt trong trình duyệt của bạn:

<!doctype html>
<html>
    <head>
        <meta charset="utf-8">
        <title>jquery.cookie Test Suite</title>

        <script src="jquery-1.9.0.min.js"></script>
        <script src="jquery.cookie.js"></script>
        <script src="JSON-js-master/json.js"></script>
        <script src="JSON-js-master/json_parse.js"></script>
        <script>
            $(function() {

               if ($.cookie('cookieStore')) {
                    var data=JSON.parse($.cookie("cookieStore"));
                    $('#name').text(data[0]);
                    $('#address').text(data[1]);
              }

              $('#submit').on('click', function(){

                    var storeData = new Array();
                    storeData[0] = $('#inputName').val();
                    storeData[1] = $('#inputAddress').val();

                    $.cookie("cookieStore", JSON.stringify(storeData));
                    var data=JSON.parse($.cookie("cookieStore"));
                    $('#name').text(data[0]);
                    $('#address').text(data[1]);
              });
            });

       </script>
    </head>
    <body>
            <label for="inputName">Name</label>
            <br /> 
            <input type="text" id="inputName">
            <br />      
            <br /> 
            <label for="inputAddress">Address</label>
            <br /> 
            <input type="text" id="inputAddress">
            <br />      
            <br />   
            <input type="submit" id="submit" value="Submit" />
            <hr>    
            <p id="name"></p>
            <br />      
            <p id="address"></p>
            <br />
            <hr>  
     </body>
</html>

Đơn giản chỉ cần sao chép / dán và sử dụng mã này để đặt cookie của bạn.


7
2017-08-06 17:47



Chỉ cần một lưu ý, trình duyệt theo mặc định bộ nhớ cache các nguồn lực theo tên tập tin của họ. Trong ví dụ này, jquery-1.9.0.min.js sẽ được tải lại cho mọi người khi tên tệp được cập nhật thành jquery-1.9.1.min.js, nếu không trình duyệt sẽ KHÔNG thực hiện yêu cầu tới máy chủ để kiểm tra nội dung cập nhật. Nếu bạn cập nhật mã bên trong jquery.cookie.js mà không thay đổi tên tệp của nó, nó có thể KHÔNG được tải lại trong các trình duyệt đã lưu trong bộ nhớ cache jquery.cookie.js nguồn. - Fagner Brack
Nếu bạn đang viết một trang web và sao chép / dán này, hãy lưu ý rằng điều này sẽ không hoạt động nếu bạn cập nhật jquery.cookie.js phiên bản mà không thay đổi tên tệp của nó (trừ khi máy chủ của bạn xử lý bộ nhớ đệm bằng cách sử dụng Thẻ điện tử). - Fagner Brack
if ($ .cookie ('cookieStore')) {var data = JSON.parse ($. cookie ("cookieStore")); // khi tải trang ở trang khác không tìm thấy $ ('# name'). văn bản (dữ liệu [0]); $ ('# address'). văn bản (dữ liệu [1]); } - Mohammad Javad


Bạn có thể sử dụng thư viện trên trang web Mozilla đây 

Bạn sẽ có thể đặt và nhận các cookie như thế này

docCookies.setItem(name, value);
docCookies.getItem(name);

5
2017-08-09 19:53