jQuery中一个页面中的多个用户控件

Posted 2023-04-18

【中文标题】jQuery中一个页面中的多个用户控件

【英文标题】：multiple usercontrols in a page in jQuery

【发布时间】：2013-10-06 23:14:24

【问题描述】：

我有一个用户控件，其中有一个textbox。我正在使用 jQuery 自动填充此文本框。

当我在一个页面上多次使用此用户控件时，它不起作用。我知道它是因为 textbox 的重复 ID，但我不知道如何解决这个问题。请帮帮我。

这是我的用户控件

    <%@ Control Language="C#" AutoEventWireup="true" CodeBehind="Classes.ascx.cs" %>
<asp:TextBox ID="txtClass" placeholder="search Class" type="text" runat="server" EnableViewState="true"
    ClientIDMode="Static" Width="250px" OnTextChanged="txtClass_TextChanged"></asp:TextBox>


<script language="javascript">

    $(function () 

        $("#txtClass").autocomplete(
            source: function (request, response) 
                var oClass = $("#txtClass").val().replace('*', '');
                .
                .
                .
                .
                
            );
        

更新

这里是html

    <input name="ctl00$BodyContent$txtClassasd$txtClass" id="txtClass" placeholder="search Class" type="text" style="width:250px;" />

<script language="javascript">

    $(function () 

        $("#txtClass").autocomplete(
            source: function (request, response) 
                var test = document.getElementById("txtClass").value;
                var oClass = $("#txtClass").val().replace('*', '');



<input name="ctl00$BodyContent$Classes1$txtClass" id="txtClass" placeholder="search Class" type="text" style="width:250px;" />
<script language="javascript">

    $(function () 

        $("#txtClass").autocomplete(
            source: function (request, response) 
                var oClass = $("#txtClass").val().replace('*', '');

【问题讨论】：

您的txtClass 是如何重复的？你能告诉我们这些代码吗？

【参考方案1】：

您需要使用 ClientID 进行服务器控件

 $("#<%=txtClass.clientID%>").autocomplete(

同时从 txtClass 控件中删除 ClientIDMode="Static"

【讨论】：

哦删除该属性 ClientIDMode="Static"

【参考方案2】：

如果您查看发送到浏览器的 html，我猜实际上并没有 ID 为“txtClass”的文本框。你应该做类似$("#<%= txtClass.ClientID %>")...

【参考方案3】：

使用ID数组：

How to selector ID textbox array using jquery

或者修改你的选择器

$("input").autocomplete(...