引用jQuery的cookie库jquery.cookie.js
<!--这里html的li要区分,这样便于添加完样式,刷新后再把样式还原,所以取了一个特别的值,也可以换成自己的--><!--如果是动态生成的更好,赋值动态的id-->
<ul class="multiselect">
<li class="invsible checkbox" id="5W-30"><a title="5W-30" href="/plus/list.php?tid=7&jiyoubiaohao=5W-30">5W-30</a></li>
<li class="invsible checkbox" id="10W-40"><a title="10W-40" href="/plus/list.php?tid=7&jiyoubiaohao=10W-40">10W-40</a></li>
</ul> $(function(){
$("li").click(function() {
//绑定点击事件,每次点击要把
$(this).addClass('act')
var id=$(this).attr('id')
//每次添加完样式要把添加的li的id记录到cookie
var addedLI=$.cookie('addedLI')//获取已添加到cookie的值
if(addedLI==null||addedLI==""||addedLI==undefined){
//首次点击li,只将当前li的id加入cookie
$.cookie('addedLI',id)
}else{
//已添加过id
addedLI+=','+id//将已加入的id和当前的id连接成字符串,逗号分隔
//更新cookie
$.cookie('addedLI',addedLI)
}
})
//页面加载完,获取存入cookie的id,分别给li加上class
var addedLI=$.cookie('addedLI')//获取已添加到cookie的值
if(addedLI!=null||addedLI!=""||addedLI!=undefined){
//将加入的值以逗号分割成数据,然后循环遍历
var strArray=addedLI.split(',')
for(var i=0i<strArray.lengthi++){
$("#"+strArray[i]).addClass('act')//给点击过的li添加上样式
}
}
})
页面刷新后数据就会被重置,因为页面已是一个全新的页面了,对于js来说,也是一个全新的运行环境。要让一个js带运行时的变量在页面刷新后也保持原样,是做不到的。要实现你说的功能,最简单的办法就是使用cookie来保存你之前的变量值,在页面加载时读取cookie再做累加。
当然还可以将数据保存到后台,页面刷新时由后台将这个数据再打到页面上。