如何显示隐藏的HtmlTable“；“列”；通过JavaScript/jQuery？

我有如下HtmlTable行：

<tr>
    <td class="centertextnowrap"><strong>Description of Expense</strong></td>
    <td class="centertext"><label>Date 1: </label><input type="date" id="date1" name="date1"/></td>
    <td class="centertext hide"><label>Date 2: </label><input type="date" id="date2" name="date2"/></td>
    <td class="centertext hide"><label>Date 3: </label><input type="date" id="date3" name="date3"/></td>
    <td class="centertext hide"><label>Date 4: </label><input type="date" id="date4" name="date4"/></td>
    <td class="centertext hide"><label>Date 5: </label><input type="date" id="date5" name="date5"/></td>
    <td class="centertext hide"><label>Date 6: </label><input type="date" id="date6" name="date6"/></td>
    <td class="skybluebackground centertext"><label><strong>Total Expenses</strong></label></td>
    <td colspan="4" class="nobordercell centertext"><label>Comments</label></td>
</tr>

…应用于除Date1之外的所有日期列，如下所示：

<td class="centertext hide"><label>Date 2: </label><input type="date" id="date2" name="date2"/></td>

为了响应“添加另一个日期”按钮的点击，我可以跟踪下一个要“揭幕”的栏目。这似乎有道理，但可能有点乏味

---

有没有更简洁的方法来实现这一点？

在开始时设置一个变量：

 var date = 1;

你的“添加另一个日期”按钮应该是这样的

date = (date + 1);
$( '<td class="centertext hide"><label>Date: </label><input type="date" id="date"'+date' name="date"'+date'/></td>" ).appendTo( "tr" )';

date=（日期+1）；
$（“日期：”）。附录（“tr”）；

在开头设置一个变量：

 var date = 1;

你的“添加另一个日期”按钮应该是这样的

date = (date + 1);
$( '<td class="centertext hide"><label>Date: </label><input type="date" id="date"'+date' name="date"'+date'/></td>" ).appendTo( "tr" )';

date=（日期+1）；
$（“日期：”）。附录（“tr”）；

一种解决方案是使用选择器。例如，如果要显示“日期5”列，可以编写：

$("#tableId td:nth-child(6)").removeClass("hide")

---

一种解决方案是使用选择器。例如，如果要显示“日期5”列，可以编写：

$("#tableId td:nth-child(6)").removeClass("hide")

---

您可以使用

:first

选择器和

hide

类。像下面

    $("td.hide:first").removeClass("hide");

一个例子

$（“按钮”）。单击（函数（）{
$（“td.hide:first”）.removeClass（“hide”）；
});
.hide{
显示：无；
}

第1栏
第2栏
第3栏
第4栏
第5栏
显示更多信息
您可以使用
:first
选择器和
hide
类。像下面

    $("td.hide:first").removeClass("hide");

一个例子


$（“按钮”）。单击（函数（）{
$（“td.hide:first”）.removeClass（“hide”）；
});
.hide{
显示：无；
}

第1栏
第2栏
第3栏
第4栏
第5栏
显示更多内容
您可以使用
.hasClass（）
和
下一步（）
您可以使用
.hasClass（）
和
。下一步（）
好的，我要用这个；然而，与此同时，我还有一个紧迫的问题，那就是我的旧代码（不是当前问题的来源）。实际上，这不太管用，因为每次选择“添加另一个日期”，我都需要取消隐藏几个单元格（tds），不仅仅是一个。如果你更新了你的问题或发布了一个新的问题，其中包含了你想要取消隐藏的
td
s的详细信息，我们可能会提供帮助。好的，我将使用这个；然而，与此同时，我还有一个紧迫的问题，那就是我的旧代码（不是当前问题的来源）。实际上，这不太管用，因为每次选择“添加另一个日期”，我都需要取消隐藏几个单元格（tds），不仅仅是一个。如果您更新了您的问题或发布了一个新的问题，其中包含了您想要取消隐藏的
td
s的详细信息，我们可能会提供帮助。