1

我目前正在创建一个简单的待办事项列表，如果有人可以帮助我处理 cookie，我将不胜感激 :)

我有 2 个函数来设置和获取 cookie：

function setCookie(key, value) {
   var expires = new Date();
   expires.setTime(expires.getTime() + 31536000000); 
   document.cookie = key + '=' + value + ';expires=' + expires.toUTCString();
}

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

有一个按钮（带有 id #add_todo ）可以将任务添加到待办事项列表中（带有类 .todo_list）。我将文本输入 $('#todo_description').val() 的值设置为 cookie。

$(document).ready( function() {  
$('#add_todo').click( function() {

    setCookie('test', $('#todo_description').val()); 
    var todoDescription = $('#todo_description').val();

    $('.todo_list').prepend(
        div class="todo"
            +checkbox              //I avoided html brackets here
            + getCookie('test')
            +delete_button
            /div
        );
});

一切正常，但是当我重新加载网页时，我之前添加的任务没有显示，我知道我做错了。我想存储包含 todoDescription、复选框、删除按钮和样式的整个 div (class="todo")。我试图将任务存储在数组中，但无法一一检索其元素..提前致谢！

4

2 回答 2

1

尝试将整个标记块存储到 cookie 中可能不是一个好主意。Cookie 更适合存储小段数据。

我试图将任务存储在数组中，但无法一一检索其元素

是什么阻止您遍历数组？

无论如何，这里可能存在一个基本的设计缺陷，即您不应该尝试将大量数据存储到 cookie 中。Cookie 只能保存几千字节的数据。考虑将实际数据存储在另一个容量更大的存储中。这是做网站的吗？如果有后端，那么它应该存储在后端的数据库中，cookie数据只是用于验证和区分用户。

于 2012-09-25T16:21:50.947 回答
0

最简单的答案是使用像 Hartl 先生的 jQuery cookie 这样的插件（我经常使用这个）。

<script src="jquery.cookies.js"></script>
<script>
   // of course, you no longer need these functions, but just plugging this into your example...

   function setCookie(key, val) {
      var expires = new Date().getTime() + 31536000000;
      $.cookie( key, val, { expires: expires, path: '/' } );
   }

   function getCookie(key) {
      return $.cookie(key);
   }
</script>

如果您需要重新发明千篇一律，您可能想在您的问题中解释这一点。

于 2012-09-25T16:10:05.080 回答