Jquery cookie 监控

Question

在浏览器的整个页面生命周期中监视 cookie 并在 cookie 更改时触发事件的最佳 JS 或 JQuery 特定方法是什么？

Answer 1

据我所知，不可能将 change （或类似）事件直接绑定到 cookie。相反，我会采用这种方法：

创建一个轮询器，每 X 毫秒将 cookie 值与之前已知的值进行比较。

// basic functions from the excellent http://www.quirksmode.org/js/cookies.html
function readCookie(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;
}

/////////////////////////////////
// ACTUAL FUN STUFF BELOW
/////////////////////////////////

var cookieRegistry = [];

function listenCookieChange(cookieName, callback) {
    setInterval(function() {
        if (cookieRegistry[cookieName]) {
            if (readCookie(cookieName) != cookieRegistry[cookieName]) { 
                // update registry so we dont get triggered again
                cookieRegistry[cookieName] = readCookie(cookieName); 
                return callback();
            } 
        } else {
            cookieRegistry[cookieName] = readCookie(cookieName);
        }
    }, 100);
}

然后使用方式将如下所示：

listenCookieChange('foo', function() {
    alert('cookie foo has changed!');
});

注意：这还没有被经过测试，这只是我如何解决该问题的快速演示。

编辑：我现在已经对此进行了测试并且它有效。 参见示例:)

Answer 2

知道吗，这对一些奇怪的事情有帮助。我试图在移动网络应用程序上使用谷歌翻译（http://translate.google.com/translate_tools?hl=en），每次更改语言时，它都会在顶部插入一个栏作为文档的第一个子项。身体 。我现在正在跟踪“googtrans”cookie 并执行此操作

listenCookieChange('googtrans', function() {
    $(document.body).css('top','0px');
});

Answer 3

有一个用于 cookies 的 jQuery 插件。

http://plugins.jquery.com/project/Cookie

访问cookie并不难在 html 文档中，它们位于 document.cookie 中。

<!-- Add cookie -->
$.cookie('cookieName':'cookieValue');

<!-- get cookie -->
$.cookie('cookieName');

<!-- removecookie -->
$.cookie('cookieName', null);

此外，还有用于添加 cookie 的选项参数，例如过期时间。

然而，在回答你的问题时，不幸的是，我实际上并不认为你可以将事件侦听器应用于 cookie。