为什么我无法使用jQuery显示/隐藏HTML的TR元素？

Question

我在HTML中有如下的TR，并且我正在使用JQuery。

<tr class="RowDiv" id="tempTR" runat="server" visible="false">                    <td>
                    <div class="LabelDiv">
                        <div class="dfltTxtBld">
                            ID<span class="reqChar" runat="server" id="Span1" visible="false">
                                *</span>
                        </div>
                    </div>
                </td>
                <td>
                    <div class="InputDiv">
                        <asp:TextBox ID="TextBox1" runat="server" CssClass="txtField" MaxLength="10"></asp:TextBox>
                    </div>
                </td>
                <td>
                    <div id="Div1" runat="server">
                    </div>
                </td>
            </tr>

在 JavaScript 代码中，我调用了以下方法来隐藏它

$('#<%= tempTR.ClientID %>').hide();

即使我试图将其隐藏然后显示，它总是不起作用.. 我试图隐藏并显示TextBox1，它可以工作，但如果我尝试使用TR，它就无法工作... 是否有任何方法可以显示/隐藏TR？

- Hotmoil

---

TempTR的ID是唯一的吗？ - Marko

它可以工作：http://jsfiddle.net/3edjh/ - aularon

我已经更新了代码，加入了产生问题的真实案例。 - Hotmoil

@Nick，这是我的错误，我已经修复了... 这不是问题。 - Hotmoil

你能发布页面的渲染HTML吗？ - NakedBrunch

Answer 1

如果我在 onload 事件中这样做，它就可以工作

$(document).ready(function(){
    $('#tempTR').hide();
});

也许你的问题出在别处？

- tom

Answer 2

我想你遇到了和这篇文章一样的问题 JQuery .Show() doesn't work with server control?

- Amr Badawy

Answer 3

我更喜欢，如果您刚刚点击了要隐藏的TR内部的元素，我将使用以下代码：

$('#other').click(function() {
    $(this).closest("tr").hide();
});

带有一些效果：

$('#other').click(function() {
   $(this).closest("tr").fadeOut('slow');
});

记得将那段代码放在你的onready函数中

$(document).ready(function($) {
  // Code using $ as usual goes here.
});

- Garis M Suero

Answer 4

这在Jquery或JavaScript中不适用于表格。您必须通过类或其他ID引用表格。使用元素ID无法与表格一起使用。

- Clem

Answer 5

在你的例子中，文本框之所以有效是因为它是一个 ASP 控件，而表格行不起作用是因为它是一个 HTML 元素。

查看实际的 HTML，并确保 $('#<%= tempTR.ClientID %>').hide(); 在呈现的 HTML 中解析为 $('#tempTR').hide();。

我已经有一段时间没有使用 ASP 了，但我相信它将被渲染为 $('#tempTR.ClientID')，这不是 DOM 中的 ID。

- whall