简明现代魔法 -> JQuery -> JQuery 学习:选择表格中的一行高亮

JQuery 学习:选择表格中的一行高亮

2010-05-05

效果演示

单击表格中的一行,该行的背景会变成黄色。再点一下,它就切换回正常形式。

姓名 QQ Email
Gonn 252211974 gonnsai@163.com
Gonn 252211974 gonnsai@163.com
Gonn 252211974 gonnsai@163.com
Gonn 252211974 gonnsai@163.com
Gonn 252211974 gonnsai@163.com
Gonn 252211974 gonnsai@163.com

JQuery Code

<style>
td { padding:3px 11px; border-bottom:1px solid #95bce2; vertical-align:top; text-align:center; }
.click{ background:yellow; }
</style>

<script type="text/javascript">
jQuery(document).ready(function(){
	jQuery(".stripe tr").click(function(){
		jQuery(this).toggleClass("click");
	})
});
</script>  

jQuery toggleClass(String class) 函数的作用是,如果存在(不存在)就删除(添加)一个类。所以使用这个函数可以很方便地实现本例中高亮与取消高亮的效果。

随机文章推荐
网站分类


注:如需转载本文,请注明出处(原文链接),谢谢。更多精彩内容,请进入简明现代魔法首页。

进入新博客
喜欢本文,就分享它吧
给我留言
您的名字:
您的邮件:
您的网站:


 

copyright © 2009 简明现代魔法    学习、分享、进步

power by Gonn 感谢所有关心和支持本站的朋友们