cookie插件下载地址：http://pan.baidu.com/s/1i4tpsET

在web项目开发过程中，会有页面的跳转，部分跳转需要加载数据，这里就存在不同的解决方案，其中之一就是cookie携带参数到跳转的页面。其他的解决方案只做思想的说明，不详细说明，cookie方式实现将在本博客中具体说明。

方式一：通过将参数拼接在链接后，发送跳转请求，在工程中将请求需要的参数放到request域中，然后跳转到目标页面，在目标页面通过request域获取参数数据，通过获取的参数再向后台发送请求，获取需要加载的数据，将数据加载到页面。这种方式需要在链接后面拼接参数，参数较少还不是很麻烦，要是参数较多就存在问题，毕竟搜索框中链接的长度是有限的，另外就是参数过于的暴露，不是很友好的方式。

方式二：在方式一的基础上，在跳转的过程中，就将请求的最终数据封装到域中，而不是将参数保存到域中，减少一次请求，这种方式同样具有方式一的缺点。不算是友好的方式。

方式三（重点）：cookie实现请求数据的封装

第一步：将需要使用的参数存储到cookie中，然后直接跳转到目标页面

第二步：在目标页面从cookie中取值，取出需要的参数，将参数存储到页面的全局变量中

第三步：发送ajax请求，带上参数，获取页面需要加载的数据，将数据显示出来

第四步：定义一个页面加载完毕事件，在页面加载结束后，将cookie携带的参数清除

优点：

1、cookie携带数据，不需要在链接中拼接参数；

2、在目标页面加载结束后，将cookie清除，可以相对保证数据安全，在整个操作过程中cookie存在的时间很短；

3、cookie清除后，可以防止cookie共享数据的污染，如两个页面的cookie对应的path属性相同且变量名相同，就会导致修改一个页面的cookie参数，另一个页面的cookie参数也会变化，造成数据污染；

4、cookie清除后，可以防止cookie数量超过限制，一个域名下存储的cookie是有限的；

缺点：

1、由于参数保存在页面的全局变量中，会造成刷新页面，数据丢失问题，但是这个问题并不是太大，因为现在大多都是采用异步请求局部刷新的方式，一般不会导致数据丢失；

2、不同的浏览器存在cookie的存储差异，可能会存在问题，但是这个问题也不大，因为主流浏览器都能完美支持，不会出现这种情况。

代码的实现：

1、 jQuery自身是没有cookie的保存、取出、删除的功能，需要自己添加jQuery的cookie插件，这里提供给大家。

<script src="https://code.csdn.net/snippets/1557059.js"></script>

2、        在页面中存储cookie的值

默认路径存储cookie的值

[javascript] view plain copy

$.cookie("test","aabbcc");

自定义路径存储cookie的值

[javascript] view plain copy

$.cookie("test","aabbcc",{path: "/web/test/list"});

注意这里设置的路径，在取cookie值的页面中，页面要是这个路径的子路径或者相同路径，否则无法取到cookie中的值

3、在页面中取出cookie的值

[javascript] view plain copy

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

cookie_value就是cookie中存在的值

4、在页面删除cookie值

页面加载结束清除cookie值

<script src="https://code.csdn.net/snippets/1557048.js"></script>

页面关闭清除cookie值

<script src="https://code.csdn.net/snippets/1557051.js"></script>

上面的两种清理方式其实是一样的，主要是相说明这两个事件。

这些都是在开发过程遇到的问题，和团队讨论的结果，希望对博友们有所帮助。有什么问题记得留言哦，大家可以一起讨论。

本文转自 兴趣e族 51CTO博客，原文链接:http://blog.51cto.com/simplelife/1740053