标签：
jQuery的toggleClass()函数代码实例:
本章节通过代码实例演示一下toggleClass()函数的用法，此函数可以判断一个元素是否具有指定的样式类，如果有这删除，如果没有则添加，这种功能在一些切换效果中非常有用，代码实例如下:
<!DOCTYPE html> <html> <head> <meta charset=" utf-8"> <meta name="author" content="http://www.softwhy.com/" /> <title>蚂蚁部落</title> <style type="text/css"> .bg{ background:#f00; color:#fff; width:300px; } ul, li{ list-style:none; font-size:12px; height:20px; line-height:20px; } [/size] [size=2]ul{ padding:0; margin:0; } </style> <script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script> <script type="text/javascript"> $(function(){ $("li").mouseover(setColor).mouseout(setColor); function setColor(){ $(this).toggleClass("bg"); } }); </script> </head> <body> <div id="div"> <ul> <li>蚂蚁部落欢迎您</li> <li>只有努力奋斗才会有美好的明天</li> <li>每一天都是新的要好好珍惜</li> <li>明天都是虚幻的，只有当下是实实在在的</li> <li>分享互助是进步的最大源动力</li> </ul> </div> </body> </html>
以上代码可以实现鼠标悬浮和离开时，li元素的背景色切换效果。
$("li").mouseover(setColor).mouseout(setColor)，注册事件处理函数，当然这里使用的是链式调用。
相关阅读:
1.mouseover事件可以参阅jQuery的mouseover事件一章节。
2.mouseout事件可以参阅jQuery的mouseout事件一章节。
3.toggleClass()可以参阅jQuery的toggleClass()方法一章节。
原文地址是:http://www.softwhy.com/forum.php?mod=viewthread&tid=13108
更多内容可以参阅:http://www.softwhy.com/jquery/
标签：
原文地址：http://www.cnblogs.com/xiaofinder/p/5155840.html
