分享web开发知识

注册/登录|最近发布|今日推荐

主页 IT知识网页技术软件开发前端开发代码编程运营维护技术分享教程案例
当前位置:首页 > 运营维护

08.01《jQuery》——cookie插件的简单应用和自己写的简单更换颜色插件

发布时间:2023-09-06 02:07责任编辑:蔡小小关键词:jQuery

1.Cookie是网站设计者放置在客户端的小文本文件。实现:存储用户曾经浏览过的产品列表,记住用户喜欢浏览哪类新闻等。

  在用户允许的情况下,还可以存储用户的登录信息,使得用户在访问网站时不必每次都键入这些信息。

首先上代码:

<!DOCTYPE html><html> ???<head> ???????<meta charset="UTF-8"> ???????<title></title> ???????<script src="../jquery-3.2.1/jquery-3.2.1.js"></script> ???????<script src="jquery.cookie.js"></script> ???????<script src="color_byself.js"></script> ???????<script type="text/javascript"> ???????????$(function(){ ???????????????$("#btn1").click(function(){ ???????????????????$("#aaa").color("red"); ???????????????}); ???????????????????????????????var COOKIE_NAME = ‘username‘; ???????????????if($.cookie(COOKIE_NAME)){ ???????????????????$("#username").val($.cookie(COOKIE_NAME)); ???????????????} ???????????????$("#remember").bind("click",function(){ ???????????????????if(this.checked){ ???????????????????????$.cookie(COOKIE_NAME,$("#usernam").val(),{path:‘/‘,expires:10}); ???????????????????}else{ ???????????????????????$.cookie(COOKIE_NAME,null,{path:‘/‘}); ???????????????????} ???????????????});
    //第一行是定义一个COOKIE_NAME属性,之后判断$.cookie(COOKIE_NAME)是否为真,当cookie中有记录是就为真,
    //判定生效后,若是真则将获取的cookie记录中的用户名赋值给文本框中,若为假,则什么都不操作
   
    //之后写CheckBox的勾选触发事件,首先判断是否勾选,若是为真则执行。cookie的方法,方法有三个参数,第一个是属性名,在这里就是COOKIE_NAME
    //第二个是属性的值,在这里就是$("#usernam").val() ?, ?第三个就是存放的地址和存放的时间了,在这里是 path:‘/‘ 和 expires:10 。ps:这里的时间是以天作为单位的

         ???????????}); ???????????????????</script> ???</head> ???<body> ???????<div > ???????????用户名:<input type="text" name="username" id="username" value="请输入用户名" /> ???????????<input type="checkbox" name="remember" id="remember" value="" />记住用户名<br /> ???????????????????????<div id="aaa"> ???????????????我是一个测试用的小文字 ???????????????<input type="button" name="btn1" id="btn1" value="变色" /> ???????????</div> ???????</div> ???</body></html>

还有一段CSS的代码:

;(function($){ ???$.fn.extend({ ???????"color":function(value){ ???????????if(value == undefined){ ???????????????return this.css("color"); ???????????}else{ ???????????????return this.css("color",value); ???????????} ???????} ???})})(jQuery);

在这里,第一段代码是写了HTML的代码,同时写了jQuery的代码,实现了一个单击更换文本颜色的代码,还有一个根据cookie使text文本框可以记住用户名的时间代码。

其中更换颜色的代码主要是为了能够练习一下怎么在单独的js文件中写一个小的插件,以便了解插件的应用和链接

cookie的代码是学习cookie插件的使用。

08.01《jQuery》——cookie插件的简单应用和自己写的简单更换颜色插件

原文地址:https://www.cnblogs.com/justlive-tears/p/9404401.html

知识推荐

我的编程学习网——分享web前端后端开发技术知识。 垃圾信息处理邮箱 tousu563@163.com 网站地图
icp备案号 闽ICP备2023006418号-8 不良信息举报平台 互联网安全管理备案 Copyright 2023 www.wodecom.cn All Rights Reserved