我写了这个非常简单的背景选择器。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js" type="text/javascript"></script>
<title>jQuery Demo</title>
<link rel="stylesheet" type="text/css" media="screen" href="Normal.css" />
<script type="text/javascript">
$(document).ready(function(){
$("#StyleContrast").click(function() {
$("link[media='screen']").attr("href", "Contrast.css");
});
$("#StylePrint").click(function() {
$("link[media='screen']").attr("href", "Print.css");
});
$("#StyleNormal").click(function() {
$("link[@media='screen']").attr("href", "Normal.css");
});
});
</script>
</head>
<body>
<h1>Choose A Style:</h1>
<ul>
<li><a id="StyleContrast" href="#">Contrast</a></li>
<li><a id="StylePrint" href="#">Print</a></li>
<li><a id="StyleNormal" href="#">Normal</a></li>
</ul>
</body>
</html>
我有: 普通.css 打印.css 对比度.css
在同一个文件夹中有一个非常基本的:
body {background-color:#000000;}
当我转到 URL 时,它会选择 Normal.css(它应该如此)
然后将其更改为 Print.css 或 Contrast.css(应该如此)就可以了
但是它不会再返回(不选择)Normal.css 了吗?
你能帮我找出代码中的问题吗?
最佳答案
$("#StyleNormal").click(function() {
$("link[@media='screen']").attr("href", "Normal.css");
});
应该是
$("#StyleNormal").click(function() {
$("link[media='screen']").attr("href", "Normal.css");
});
此外,我会将您使用的 jQuery 版本更新为 1.4.2
您使用了 [@media='screen']
而不仅仅是 [media='screen']
在 jQuery 1.4.2 中(我认为在 jQuery 1.3 中)用于属性选择的 @
已被弃用。请注意,您在代码的前两次调用中都是正确的,而不是最后一次。 :D
关于javascript - 简单的 jQuery css 背景 "chooser",我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/3874188/