记住不同样式表的Cookie问题
Cookie issue with remembering different stylesheets
我正在创建一个允许用户更改配色方案和文本大小的网站。我正在使用cookie,所以当他们改变页面时,它会记住他们选择的配色方案/文本大小。
问题是网站没有同时正确地"记住"配色方案和字体。
当只使用其中一种或另一种时,它工作得很好,例如,当选择配色方案时,它会记住每个页面上选择的配色方案。
然而,当我改变配色方案,并试图改变字体的大小,网站停止记住所选择的配色方案,并回到默认的配色方案(但记住文字的大小)。
我猜这是因为我设置了两个cookie而不是一个,但是当我试图设置一个时,我无法获得代码的工作。
<link class="changeme" rel="stylesheet" type="text/css" href="default.css" title="Standard" />
<link rel="stylesheet" type="text/css" href="twitter/jquery.jtweetsanywhere-1.3.1.css" />
<!-- Loading Javascript -->
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" language="javascript" src="jquery.cookie.js"></script>
<script type="text/javascript" src="twitter/jquery.jtweetsanywhere-1.3.1.js"></script>
<script> if($.cookie("css")) {
$("link.changeme").attr("href",$.cookie("css"));
}
$(document).ready(function() {
$("#nav li a").click(function() {
$("link.changeme").attr("href",$(this).attr('rel'));
$.cookie("css",$(this).attr('rel'), {expires: 365, path: '/'});
return false;
});
});
</script>
<script>
if($.cookie("css2")) {
$("link.changeme").attr("href",$.cookie("css2"));
}
$(document).ready(function() {
$("#resize li a").click(function() {
$("link.changeme").attr("href",$(this).attr('rel'));
$.cookie("css2",$(this).attr('rel'), {expires: 365, path: '/'});
return false;
});
});
</script>
修改样式表
<div id="colourscheme">
<ul id="nav">
<li><a class="colourtext">Colour Scheme: </a></li>
<li><a class="default" href="#" rel="default.css">Default</a></li>
<li><a class="wandb" href="#" rel="alternative.css">White and Black</a></li>
</ul>
<!-- Adjust font size -->
<div id="textadjustment">
<ul id="resize">
<li><a class="textsize">Resize Text: </a></li>
<li><a class="small" href="#" rel="default.css">A</a></li>
<li><a class="medium" href="#" rel="large.css">A</a></li>
<li><a class="large" href="#" rel="largest.css">A</a></li>
</ul>
</div>
我还在学习这个,所以抱歉,如果它是一些简单的回答!
使用两个样式表引用
HTML文档
<!doctype html>
<html>
<head>
<link class="colorCss" rel="stylesheet" type="text/css" href="defaultColor.css" />
<link class="fontCss" rel="stylesheet" type="text/css" href="defaultFont.css" />
<link rel="stylesheet" type="text/css"
href="twitter/jquery.jtweetsanywhere-1.3.1.css" />
<!-- Loading Javascript -->
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" language="javascript" src="jquery.cookie.js"></script>
<script type="text/javascript" src="twitter/jquery.jtweetsanywhere-1.3.1.js"></script>
<script type="text/javascript">
if($.cookie("css")) {
$("link.colorCss").attr("href",$.cookie("css"));
}
if($.cookie("css2")) {
$("link.fontCss").attr("href",$.cookie("css2"));
}
$(document).ready(function() {
$("#nav li a").click(function() {
$("link.colorCss").attr("href",$(this).attr('rel'));
$.cookie("css",$(this).attr('rel'), {expires: 365, path: '/'});
return false;
});
$("#resize li a").click(function() {
$("link.fontCss").attr("href",$(this).attr('rel'));
$.cookie("css2",$(this).attr('rel'), {expires: 365, path: '/'});
return false;
});
});
</script>
</head>
<body>
<div id="colourscheme">
<ul id="nav">
<li><span class="colourtext">Colour Scheme: </span></li>
<li><a class="default" href="#" rel="defaultColor.css">Default</a></li>
<li><a class="wandb" href="#" rel="alternative.css">White and Black</a></li>
</ul>
</div>
<div id="textadjustment">
<ul id="resize">
<li><span class="textsize">Resize Text: </span></li>
<li><a class="small" href="#" rel="defaultFont.css">Default</a></li>
<li><a class="medium" href="#" rel="large.css">Large</a></li>
<li><a class="large" href="#" rel="largest.css">Largest</a></li>
</ul>
</div>
</body>
</html>
defaultColor.css
body {
background-color: #aa0000;
color: #0000aa;
}
defaultFont.css
body {
font-size: 12px;
}
alternative.css
body {
background-color: #000;
color: #aaa;
}
large.css
body {
font-size: 14px;
}
largest.css
body {
font-size: 18px;
}
相关文章:
- 让用户通过javascript访问cookie是一个安全问题
- 使用cookie(javascript)时,for循环中的If/Elseif语句出现问题
- Cookie不适用于Chrome,但它'使用Firefox(localhost)没问题
- 使用 Iframe 问题设置跨域 Cookie
- 我在设置 Cookie 时遇到问题
- jquery显示,隐藏,滑动切换与cookie的问题
- 在 PHP 中使用 js API 使用 evercookie 创建 cookie 的问题
- 保存、从 cookie 加载时出现问题
- 有关应用程序中的 Cookie 和会话 ASP.net 问题
- Jquery.cookie 插件的问题
- jquery cookie插件的问题
- cookie问题,关闭浏览器后cookie丢失
- Varnish与无cookie的域-同源政策问题
- 获取cookie值的问题
- 使用javascript的cookie问题
- javascript倒计时计时器的Cookie问题
- Javascript获取Cookie问题
- 记住不同样式表的Cookie问题
- Ionic/angularjs如何修复未知提供商的Cookie问题
- 删除cookie问题JS-COOKIE