问题描述
- JQuery 开关灯问题，求大神指点
-
为啥点击只能使之变黑，再点就没反应了呀。。。<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <title></title> <meta charset="utf-8" /> <script src="scripts/jquery-2.1.4.min.js"></script> <script type="text/javascript"> $(function () { $("#kgd").click(function () { $(document.body).toggleClass("night"); //没有就加，有就移除 }); }); </script> <style type="text/css"> .night{background-color:black;} </style> </head> <body> <input value="开关灯" id="kgd" type="button" /> </body> </html>
解决方案
IE是有这个问题，直接设置样式可以。。
$("#kgd").click(function () {
$(document.body).toggleClass("night"); //没有就加，有就移除
document.body.style.backgroundColor = document.body.className=='night'?'black':'white'
});
解决方案二：
你js 只做了一个操作啊！！！
解决方案三：
好吧 我弄错了。。。不是这个原因
解决方案四：
开关灯问题
解决方案五：
你这扯淡啊 这不是对的么。。。
解决方案六：
看看逻辑也知道啦，有加class，有去class吗？
解决方案七：
你先要明白toggleClass的用法；的确是有了就不加，没有就加，但是是针对同级元素。一个页面只有一个body，所以你不管怎么操作都是一样的，但是如果用两个div去代替body试试，应该就没有问题了。
解决方案八：
没问题了
<!DOCTYPE html>
<br>
$(function () {<br>
$("#kgd").click(function () {<br>
$(document.body).toggleClass("night"); //没有就加，有就移除<br>
});<br>
});<br>
<br>
.night{background-color:black;}<br>
解决方案九：
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title></title>
<meta charset="utf-8" />
<script src="http://libs.baidu.com/jquery/1.9.1/jquery.min.js"></script>
<script type="text/javascript">
$(function () {
$("#kgd").click(function () {
$(document.body).toggleClass("night"); //没有就加，有就移除
});
});
</script>
<style type="text/css">
.night{background-color:black;}
</style>
</head>
<body>
<input value="开关灯" id="kgd" type="button" />
</body>
</html>```
解决方案十：
我在本地用jquery-1.4.4.js是没有问题的，
如果你这不行的话，建议换下Jquery版本试试。
时间： 2024-10-02 11:46:50