javascript - 更改表格行内的属性

Question

如果这是一个重复的问题，我深表歉意，但我找不到答案。没有例子，我无法找到提出问题的方法。想象一下我有数百行的表格。现在，在每一行上我都有一个选择框:

<select id="task_stat" name="task[stat]" style="display: none;"></select>

选项现在不是问题(我的实际文件中有一些)。现在所有这些选择框都有相同的 id field 。我想知道当一个选择框对应 <tr> 时，如何更改它的显示？被点击。我有以下内容:

$("#myTableId tr").click(function() {
    $("select #task_stat").css("display"),"block");
});

当然有 $(document).ready功能。但这将显示所有选择框(如预期的那样)，而不仅仅是一个。有没有办法在单击的表格行上只显示选择框？ (如果可以点击<td>我会很喜欢，但我认为<td>不支持.click

Answer 1

首先，你不能有重复的id字段，请改用类。其次，您应该能够像这样更改您的函数，它引用 tr 的子元素。被点击的:

$("#myTableId tr").click(function() {
    $(this).children("select .task_stat").css("display","block");
});

假设您将标记更改为如下所示:

<select class="task_stat" name="task[stat]" style="display: none;"></select>

编辑

如以下评论所述，这可能嵌套在 tr 的直接后代之外, 所以使用 find() 会更合适而不是 children() :

$("#myTableId tr").click(function() {
    $(this).find("select .task_stat").css("display","block");
});