发表于: 2017-05-26 23:04:30
1 890
今天完成的事情:
1、将任务6-10中侧边栏的部分进行改写,之前采用bootstrap的下拉菜单,结果在失焦时,下拉菜单会收回,于是将下拉菜单采用bootstrap的折叠来实现侧边栏的功能。这样,失焦时折叠菜单不会自动收回。
2、给上传图片部分一个图片大小的提示。
3、引入jquery.cookie.js,将折叠状态进行保存,实现刷新后折叠菜单保持原状的功能。不过还差最后一步,将状态赋予给相应的元素。
明天计划的事情:
1、完成刷新后下拉菜单保持不变的功能。
遇到的问题:
1、jq选择器无法选择到我需要的元素。其中id为保存对应元素的data-target属性的值,其中最后两行代码就是将被保存的状态赋予给对应的元素,但这一步一直没起作用。可能是选择器的写法有问题,因为被注释掉的两行代码能实现,只是这样会导致所有的折叠菜单打开或关闭。
$(document).ready(function(){
var id=$.cookie('page');
console.log(id);
console.log("cookie状态1",$.cookie('status1'));
console.log("cookie状态2",$.cookie('status2'));
// $("a.managelist").attr('class',$.cookie('status1'));
// $("a.managelist").siblings('ul.detailslist').attr('class',$.cookie('status2'));
$("[data-target=id]").attr('class',$.cookie('status1'));
$("[data-target=id]").siblings('ul.detailslist').attr('class',$.cookie('status2'));
});
收获:
1、学会了如何使用jquery.cookie,是一个轻量级的Cookie管理插件。
大概的使用方法如下:
$.cookie('the_cookie'); //读取Cookie值
$.cookie('the_cookie', ‘the_value'); //设置cookie的值
$.cookie('the_cookie', ‘the_value', {expires: 7, path: ‘/', domain: ‘jquery.com', secure: true});//新建一个cookie 包括有效期 路径域名等
$.cookie('the_cookie', ‘the_value'); //新建cookie
$.cookie('the_cookie', null); //删除一个cookie语法:$.cookie(名称,值,[option])
(1)读取cookie值
$.cookie(cookieName) cookieName:要读取的cookie名称。
示例:$.cookie("username"); 读取保存在cookie中名为的username的值。
(2)写入设置Cookie值:
$.cookie(cookieName,cookieValue); cookieName:要设置的cookie名称,cookieValue表示相对应的值。
示例:$.cookie("username","admin"); 将值"admin"写入cookie名为username的cookie中。
$.cookie("username",NULL); 销毁名称为username的cookie
(3) [option]参数说明:
expires:有限日期,可以是一个整数或一个日期(单位:天)。如果不设置这个东西,浏览器关闭之后此cookie就失效了
path:cookie值保存的路径,默认与创建页路径一致。
domin: cookie域名属性,默认与创建页域名一样。如果要主域名二级域名有效则要设置".xxx.com"
secrue:一个布尔值,表示传输cookie值时,是否需要一个安全协议。
评论