如何使用JavaScript查找动态生成的控件？

Question

我已经在后面的代码中创建了一个HTML表，并将其添加到ASPX页的面板控件中。

现在，我想使用JavaScript中的ID来获取表格，以实现表格排序器。

   $(document).ready(function () {
        $("myTable").tablesorter();
    });

它不能识别我在Codebehind中创建的mytable控件：

       HtmlTable Table= new HtmlTable();        
       Table.ID = "NavTable";

请尝试通过多种方法帮助我，但没有任何效果。

提前致谢

Answer 1

您有几种选择。 基本思路是将感兴趣的控件的ClientID输出到您可以找到它的位置。

例如：

$(document).ready(function () {
    $("#<%=this.TableControl.ClientID%>").tablesorter();
});

或者：如果您在ASP.NET 4.5环境中，则可以设置ClientIDMode =“ Static”并将其直接硬编码在脚本中。 但是请注意，如果引入ID冲突，ASP.NET会手。

<asp:Grid ClientIDMode="Static" ID="my_static_table_id" />
$(document).ready(function () {
    $("#my_static_table_id").tablesorter();
});

Answer 2

你举的例子中包含不同的ID myTable和NavTable 。 如果要按ID选择，则使用的选择器不正确。 您的选择器必须如下所示：

$("#NavTable").tablesorter();

因此，您忘记了选择器值的敏锐度。

Answer 3

这里有几个问题。

您尝试从javascript引用“ myTable”，并将其命名为“ NavTable”。
在jQuery中通过id引用html元素时，需要在开始时使用#来告诉jQuery选择器是ID，而不是html标签名称。
为确保ASP.NET在HTML输出中不使用其他ID，您应该从用C＃创建的ASP.NET服务器端对象获取ClientID值（如果在ASP.NET用户中声明，则可能会发生这种情况）控制）。

代码如下所示：

$(document).ready(function () {
    $("#<%=Table.ClientID%>").tablesorter();
});

为此，您还需要将Table变量声明为类中的成员，以便设计代码可以在范围内看到它。 否则，只能在您创建它的方法中访问它。

如果您知道这将始终生成您为其分配的实际ID，则可以在javascript中对其进行硬编码，如下所示：

$(document).ready(function () {
    $("#NavTable").tablesorter();
});