首页 新闻 会员 周边

如何实现点击table中td改变其背景颜色,点击其他td时恢复该td背景色

0
悬赏园豆:10 [待解决问题]

如题。

<table id="tableTime" runat="server" width="100%" height="100%" border="0" cellspacing="1" class="tableTime">
<tr><td></td><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr><td></td><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr><td></td><td></td><td></td><td></td><td></td><td></td><td></td></tr>

</table> 

由于有多个td所以不能每个td都写上onclick类似,上图就是我做的日历,只是截图一小部分,例如点击23号时背景色变化,点击其他td时背景色回复它的原始颜色,是否可以通过js或者jquery实现??

lijunmomo的主页 lijunmomo | 初学一级 | 园豆:34
提问于:2014-03-03 14:15
< >
分享
所有回答(3)
0

$('#tableTime td').click(function(){

  $(this).css('background-color':'green');//点击的设置为绿色

     $('#tableTime td').not(this).css('background-color':'red');//其他的全部设置为红色

});

不懂cc | 园豆:877 (小虾三级) | 2014-03-03 14:19

你好,我做的这个是web版日历,td本身就有背景色,点击它时显示别的颜色,离开后还是回复本身的颜色,我修改问题了,你帮我看看吧

支持(0) 反对(0) lijunmomo | 园豆:34 (初学一级) | 2014-03-03 14:51
0

先获取本身的背景色 存起来 然后 跟上面操作一样

wolfy | 园豆:2636 (老鸟四级) | 2014-03-03 16:31
0

$('#tableTime td').each(function(){
                $(this).css("background-color","blue");//还原所有td的颜色
                $(this).click(function(){
                    $(this).css("background-color","red");//设置点击td的颜色
                });
            });

单恋 | 园豆:678 (小虾三级) | 2014-03-04 17:18

你好,对juqery不是很熟,不明白,能解释下吗?谢谢了

支持(0) 反对(0) lijunmomo | 园豆:34 (初学一级) | 2014-03-04 17:46

@lijunmomo: each遍历所有的td标签,设置默认颜色,当某个td点击时,被点击的td会执行click事件。

支持(0) 反对(0) 单恋 | 园豆:678 (小虾三级) | 2014-03-04 17:55

@单恋: 那td执行click事件之后背景颜色是改变了,怎么恢复原有颜色呢?再说所有的td不是只有一中颜色的啊,是根据每个月的日期变化的呀

支持(0) 反对(0) lijunmomo | 园豆:34 (初学一级) | 2014-03-05 09:38

@lijunmomo: 有一个toggle()函数,试试可以切换否。你那个根据每月日期变好颜色是什么意思?是说每个月的颜色都不一样?

支持(0) 反对(0) 单恋 | 园豆:678 (小虾三级) | 2014-03-05 09:54

这是日历控件,每个月都有不是本月的日期显示灰色,我现在做的是它的web版,就是点击每个日期时候会变色,点击另一个时会恢复原始颜色。

支持(0) 反对(0) lijunmomo | 园豆:34 (初学一级) | 2014-03-05 14:05
清除回答草稿
   您需要登录以后才能回答,未注册用户请先注册