使用jquery.cookie操作Cookie实例

简介:

我们在WebForm上增加 “增加,删除,修改”三个按钮,并使用一个文本框来显示当前写入的Cookie的内容,我们将为每个按钮写一个处理函数。

对Cookie操作实例

复制代码
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="testCookie.aspx.cs" Inherits="testCookie" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <script src="Scripts/jquery-1.4.1.min.js" type="text/javascript"></script>
    <script src="Scripts/jquery.cookie.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(function () {
            //绑定addCookie的时间
            $("#addCookie").bind("click", function () {
                addCookie();
            })
            //查看cookie的值
            $("#ReadCookie").bind("click", function () {
                ReadCookie();
            })
            //删除cookie的值
            $("#delCookie").bind("click", function () {
                delCookie();
            })
        })
        function addCookie() {//增加Cookie
            $.cookie('firstCookie', $("#inputValue").val());
        }
        function delCookie() {//删除Cookie
            alert($.removeCookie('firstCookie'));
        }

        function ReadCookie() {//查看Cookie
            $("#inputValue").val($.cookie('firstCookie')); //将cookie值附加到文本框
            alert('cookie的值:' + $.cookie('firstCookie'));
        }
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <div>
            <input type="button" id="addCookie" name="name" value="增加/修改" />
            <input type="text" id="inputValue" name="name" value=" " /></div>
        <div>
            <input type="button" id="delCookie" name="name" value="删除" />
            <input type="button" id="ReadCookie" name="name" value="读取" />
        </div>
    </div>
    </form>
</body>
</html>
复制代码
 

增加前

image

增加后

image

本文转自陈哈哈博客园博客,原文链接http://www.cnblogs.com/kissazi2/archive/2013/04/04/2999376.html如需转载请自行联系原作者

kissazi2
相关文章
|
7月前
|
JavaScript
Jquery插件知识之Jquery.cookie实现页面传值
Jquery插件知识之Jquery.cookie实现页面传值
38 0
|
28天前
|
存储 JavaScript 前端开发
JavaScript DOM 操作:解释一下 cookie、sessionStorage 和 localStorage 的区别。
Cookie是服务器发送至客户端的文本信息,会随每个请求发送回服务器,适合控制会话状态但可能暴露隐私。SessionStorage仅在当前会话中存储数据,关闭浏览器后清除,适合临时存储如登录状态。LocalStorage则持久保存数据,即使关闭浏览器也不会清除,适用于存储长期设置。三种方式各有侧重,应按需求选择。
17 0
|
2月前
|
前端开发 JavaScript
jquery+css实现Tab栏切换的代码实例
jquery+css实现Tab栏切换的代码实例
31 0
|
2月前
|
JavaScript 前端开发
jquery实现二级导航下拉菜单效果实例
jquery实现二级导航下拉菜单效果实例
22 0
|
8月前
|
存储 JavaScript
js -cookie的操作
cookie是存储在客户端浏览器中的一段文本信息。
|
4月前
|
数据安全/隐私保护
Session 管理以及Cookie 应用最简单实例
Session 管理以及Cookie 应用最简单实例
|
5月前
|
XML JavaScript 前端开发
【Web智能聊天客服】之JavaScript、jQuery、AJAX讲解及实例(超详细必看 附源码)
【Web智能聊天客服】之JavaScript、jQuery、AJAX讲解及实例(超详细必看 附源码)
54 0
|
5月前
|
存储 前端开发 Java
【源码共读】在前端如何操作 Cookie
【源码共读】在前端如何操作 Cookie
64 1
|
6月前
|
存储 JavaScript 前端开发
cookie相关操作
cookie相关操作
35 0