2015-12-28 28 views
0

中指定下一行的第一列与特定类我一直在试图通过各种解决方案来破解这个jQuery的秘密,但没有成功。我有一个使用类.available.unavailable的日历,我正在尝试创建半天。它的工作原理,如果这些类不会在一周的第一天开始或一周的最后一天结束,因为每下面的截图:如何在表

Calendar view on website

您可以在四月看到它工作正常,但到5月开始的一天从那周的第一天开始,所以它不起作用。我使用来实现这一效果的jQuery是这样的:

$(".datetimepicker table td.available").next("td.unavailable").addClass("start-day"); 
$(".datetimepicker table td.available").prev("td.unavailable").addClass("end-day"); 

的问题是因为在表中的下.unavailable块是在未来<tr>,但我不知道这可怎么检查,使代码块如下像这样:

<tr> 
... 
<td class="available cur-month">21</td> 
</tr> 
<tr> 
<td class="unavailable cur-month">22</td> 
... 
</tr> 

所以我上面的jQuery代码不能识别类,因为它不直接在它旁边。如何查看.available之后的下一个元素是否为.unavailable,如果它是由一行分隔的?

编辑:

在我结束了再杀这个想法,并通过每个TD循环结束和开始和结束日期比较的数组,并加入相关类。现在工作正常。

回答

0

可以使用.closest()选择父<tr>和使用.next/prev()选择下一个/上一个<tr>和使用.find()

$(".datetimepicker table td.available").closest('tr').next('tr').find("td.unavailable").addClass("start-day"); 
$(".datetimepicker table td.available").closest('tr').prev('tr').find("td.unavailable").addClass("end-day"); 
+0

我试过很多类似的建议了这一点。它给了我[这个效果](http://imgur.com/dazxVMm) – jk1001