新手 开灯关灯效果
1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 2 <html xmlns="http://www.w3.org/1999/xhtml"> 3 4 <head> 5 6 7 <title>简单的开灯关灯效果</title> 8 <style type="text/css"> 9 .cls 10 { 11 background-color: Gray; 12 } 13 </style> 14 <script src="jquery-1.10.2.js" type="text/javascript"></script> 15 <script type="text/javascript"> 16 $(function () { 17 $('#Btn').click(function () { 18 if ($('body').hasClass('cls')) { 19 $('body').removeClass('cls'); 20 $('#Btn').val('关灯'); 21 } else { 22 $('body').addClass("cls"); 23 $('#Btn').val('开灯'); 24 } 25 26 }); 27 }); 28 </script> 29 30 </head> 31 <body> 32 <input type="button" value="开灯/关灯" id="Btn" /> 33 </body> 34 </html>
一个简单的模拟。
-
博客地址:http://www.cnblogs.com/wolf-sun/
博客版权:如果文中有不妥或者错误的地方还望高手的你指出,以免误人子弟。如果觉得本文对你有所帮助不如【推荐】一下!如果你有更好的建议,不如留言一起讨论,共同进步! 再次感谢您耐心的读完本篇文章。