jquery - 使用 jQuery 和 ASP.NET 用户控件时如何处理元素 ID

Question

我在 ASP.NET 中有一些用户控件，我将它们简单地用作 HTML，即没有任何隐藏代码。

我的一个控件有一个具有固定 ID 的元素，我用一些 jQuery 客户端脚本来指向它。例如:

<div id="slider-section"></div>

<script type="text/javascript" language="javascript">
    $(document).ready(function () {
        var slider = $('#slider-section');
        // ... do something with the jQuery Object
    });
</script>

这工作得很好，没有任何问题。但这有一个副作用。事实上，如果我在页面上添加同一用户控件的两个实例，我将拥有两个具有相同 ID 的元素。

您认为处理这种情况的好方法是什么？

谢谢

Answer 1

Asp.net Controller 在客户端呈现时会创建不同的 ID，例如:

您定义一个文本框:

<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>

如果你检查页面的源代码，你会注意到文本框ID将是这样的:

id="{GUID}_Textbox1"

所以你需要做的是使用选择器来查找 ID 的末尾，如下所示:

<div id="slider-section"></div>

    <script type="text/javascript" language="javascript">
        $(document).ready(function () {      
            var slider = $('input[id$='TextBox1']').{youroptions};
            // ... do something with the jQuery Object
        });
    </script>

在此处查看文档:http://api.jquery.com/category/selectors/

享受;)