我在asp.net MVC应用程序的主页中有一个5个图片的图像滑块。现在,当用户单击应用程序中的其他菜单选项卡时,最后看到的图像滑块图像应存储在cookie中。因此,当用户返回主页时,图像滑块将从上次看到的图像开始。我的chtml:
<div id="sliderFrame">
<div id="slider">
<a id="image1" href='#' class='linkdisabled'>
<img src="~/content/Internal/Images/image1.jpg" alt="" />
</a>
<a id="image2" href='#' class='linkdisabled'>
<img src="~/content/Internal/Images/image2.jpg" alt="" />
</a>
.....
我正在考虑通过ID在Cookie中覆盖图像,当用户返回主页时,Cookie中的最后存储图像将显示在图像幻灯片中。 但是如何获取图像ID并将其存储到cookie中?请帮忙。
答案 0 :(得分:0)
首先,获取链接容器和此容器内的链接集合
var slider = document.getElementById("slider");
var links = slider.getElementsByTagName("a");
接下来,初始化一个设置cookie的方法
function setCookie(){
document.cookie="lastSeenImageId=" + this.id;
}
为每个链接添加事件侦听器。注意:在这个例子中,我不考虑Internet Explorer的支持&lt; 9,因为我不知道您是否使用jQuery或您自己的方法来实现跨浏览器兼容性:
for(var i=0; i<links.length; i++){
links[i].addEventListener("click", setCookie, false);
/*(function(j){
links[j].attachEvent("onclick", function(){
setCookie.call(links[j]);
});
})(i);*/
}
最后,在加载页面时触发点击事件
function fireAnEvent(){
var cookie = document.cookie;
if(cookie && document.cookie.test(/lastSeenImageId=([^;]+)/)){
var link = document.getElementById(RegExp.$1);
link.click();
}
}
window.addEventListener("load", fireAnEvent, false);
// window.attachEvent("load", fireAnEvent);
此代码只是一个示例,可能需要根据您的需要进行一些修正。