如何使用jquery将数据保存在cookie中[重复]答案

【问题标题】：how to save data in a cookie using jquery [duplicate]如何使用jquery将数据保存在cookie中[重复]
【发布时间】：2014-01-19 13:23:52
【问题描述】：

我正在尝试将某些数据保存到 cookie 中，这样如果我从一个页面跳转到另一个页面，输入的数据应该被保存并在刷新时重新检索。我有一个链接：

<div class="esc-policy">
     <a href="#">New Link</a>    
</div>

在触发点击事件之前，我需要保存输入的以下数据字段：

     <table class="form">
       <tr>
          <td class="label">
                <label>Name*</label>
                <input id="nameInput" type="text" maxlength="100"/>
         </td>    
        <td class="label">
               <label>Description</label>
               <input id="descriptionInput" type="text" maxlength="200" >
        </td>
       </tr>
    </table>

我有这样的东西作为我的 js：

if ($.cookie('back_to_url_onPage_referesh')) {
  this.name.attr("value", $.cookie('name'));
  this.description.attr("value", $.cookie('description'));
}

我不确定这是如何工作的。有人可以帮忙吗！

提前谢谢...

我能够将值保存在 cookie..但是我仍然不知道如何在从一个 URL 跳回到另一个 URL 时检索它。例如：我有一个 url：（'#/link/create'）我在哪里创建这个 cookie..onclick <a href="#">New Link</a>..我需要导航到另一个 url '#/new-link/create'，输入几个表格该页面上的字段，当我点击“保存”按钮时 - <a href="#" class="btn">Save</a>, 它应该带我回到这个网址：('#/link/create')..当我在页面之间导航时，数据当然消失了，如何保存UI 端的数据？？？

【问题讨论】：

stackoverflow.com/questions/1599287/…
查看此链接Working with cookies in jQuery
查看stackoverflow.com/questions/1458724/….. 这清楚地解释了一切。

标签： javascript jquery html cookies

【解决方案1】：

$(".esc-policy  a").on('click',function(){
   var name = $("#nameInput").val(),
   description = $("#descriptionInput").val();
   $.cookie('back_to_url_onPage_referesh', 1);
   $.cookie('name',name);
   $.cookie('description',description);
});

如果您添加此代码，它将像在您的 js 中一样工作。如果您不在 jquery 中使用 cookie 插件。使用原生 document.cookie 表达式，或者使用 cookie 函数扩展 jquery 对象

你可以使用这个插件 https://code.google.com/p/cookies/wiki/Documentation#With_jQuery

【讨论】：

感谢您的回答，Kishorevarma。但是我不确定这是做什么的： $.cookie('name',name); $.cookie('描述',描述); $.cookie('name') 是做什么的？
$.cookie('name',name) 确实存储了您在名为 'name' 和 $.cookie('description',description) 的 cookie 的输入框中输入的名称值；也会这样做，它将描述数据存储在名为 description 的 cookie 中，当您使用 $.cookie('name') 时，它将查看是否创建了名为 'name' 的任何 cookie。如果它在那里，那么它将返回值
据我所知，jQuery 中没有这样的函数cookie....
有些插件没有内置
@Kishorevarma 如果您的代码依赖于插件，那么您至少可以在答案中指定哪个插件（最好带有链接）。

【解决方案2】：

要使用 Cookie，请查看 jQUery Cookie 插件

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

你可以这样做：

$.cookie("test", 1);

删除：

$.removeCookie("test");

此外，要在 cookie 上设置一定天数（此处为 5）的超时时间：

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

如果省略 expires 选项，则 cookie 成为会话 cookie，并在浏览器退出时被删除。

涵盖所有选项：

$.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).
});

读取 cookie 的值：

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

如果 cookie 是在与当前路径不同的路径上创建的，您可能希望指定路径参数：

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

【讨论】：

【解决方案3】：

这是您要实现的目标的示例。看看它是否适合你

<body>
        <script>
            $(document).ready(function(){
                $("#btn").click(function(){
                    var text1 = $('#text1').val();
                    var text2 = $('#text2').val();
                    $.cookie('text1', text1);
                    $.cookie('text2', text2);
                });
                checkCookieValues();
            });
            function checkCookieValues(){
                if ($.cookie('text1')!=="undefined") {
                    $('#text1').val($.cookie('text1'));
                }
                if ($.cookie('text2')!=="undefined") {
                    $('#text2').val($.cookie('text2'));
                }
            }
        </script>
        <form name="trial" id="trial">
            <input type="text" value="" id="text1" name="text1"/>
            <input type="text" value="" id="text2" name="text2"/>
            <input type="button" value="btn" id="btn"/>
        </form>
    </body>

注意：通过jquery使用cookie需要jquery cookie插件

【讨论】：

【解决方案4】：

设置 cookie

$.cookie("cookie_name", "cookie_value");

获取 cookie

alert( $.cookie("cookie_name") );

删除 cookie

$.removeCookie("cookie_name");

【讨论】：

据我所知，jQuery中没有cookie这样的功能......