Webforms 自定义Web控件ID包括子ID

我的自定义Web控件（ascx）

网页设备迁移的实现

<%@ Page Language="C#" MasterPageFile="~/SiteMasterPage.master" AutoEventWireup="true" CodeFile="EquipmentMove.aspx.cs" Inherits="Equipment_EquipmentMove" %>

 <Custom:AutoCompleteTextBox runat="server" ID="HardwareSNTextBox1"
            OnCloseFunction="TestOnClosefunction"
            OnFocusFunction="testme"
            OnKeyUpFunction="EquipmentSearchCheckHardwareSNLength"
            PostbackURL="EquipmentMove.aspx/HardwareSNAutoComplete"
            SpellCheck="false" />

在运行时，Custom:AutoCompleteTextBox控件的客户端ID变为“HardwareSNTextBox1_AutoCompleteTextBox”。结果标记：

<input name="ctl00$cpBody$HardwareSNTextBox1$AutoCompleteTextBox" type="text" id="ctl00_cpBody_HardwareSNTextBox1_AutoCompleteTextBox" class="ui-autocomplete-input" autocomplete="off">

如果我想在设备移动网页上写一个名为“TestOnClosefunction”的javascript，我想访问这个控件，但使用它最初输入的ID“HardwareSNTextBox1”而不是“HardwareSNTextBox1_AutoCompleteTextBox”，这是可能的吗

编辑：

---

我想，如果使用这个自定义web控件的开发人员在编写js时检查实际ID的标记，那么这可能会起作用。但不是很直观。

一个很好的方法是使用服务器控件的

ClientID

属性，例如在

EquipmentMove

ASPX页面中：

<form id="form1" runat="server">
    <div>
        <Custom:AutoCompleteTextBox runat="server" ID="HardwareSNTextBox1" />
        <input type="button" value="Test" onclick="javascript:TestOnClosefunction()" />
    </div>
</form>
<script type="text/javascript">
    function TestOnClosefunction() {
        var textBox = document.getElementById('<%= HardwareSNTextBox1.FindControl("AutoCompleteTextBox").ClientID %>');
        console.log(textBox.value);
    }
</script>

函数TestOnClosefunction（）{
var textBox=document.getElementById（“”）；
console.log（textBox.value）；
}

要验证它是否有效，只需单击

测试

按钮，在浏览器控制台中打印

文本框

的值

解释

嵌入服务器端代码行并在JavaScript中使用

ClientID

属性可以确保无论生成的ID是什么，都会发现服务器控件

更新：也许我应该强调的是这一行：

var textBox=document.getElementById（“”）

变成：

var textBox=document.getElementById（'HardwareSNTextBox1_AutoCompleteTextBox'）

当页面运行时。与在JavaScript中硬编码ID相比，它的优势在于它的工作与控件属性设置的值无关
 是的，有可能。您需要正确的选择器：这不起作用。我应该在它运行时显示结果标记。自定义web控件只是成为一个id为HardwareSNTextBox1_AutoCompleteTextBox的输入标记。没有创建其他标记。@user3140169您尝试过吗？我使用了与您相同的ID，因此您可以将其复制并粘贴到页面中。按原样，答案假设输入标记的ID是
硬件ntextbox1\u AutoCompleteTextBox
。请尝试一下，然后告诉我。只有当开发人员检查自定义web控件，知道它们必须在名称中包含“\u AutoCompleteTextBox”时，这才有效。我一直在寻找一个更干净的解决方案，或者希望有一个。@user3140169答案基于您的问题。如果您需要进一步帮助，请更新您的原始帖子，提供更多详细信息和/或要求，或提出新问题。别让我们猜。
<form id="form1" runat="server">
    <div>
        <Custom:AutoCompleteTextBox runat="server" ID="HardwareSNTextBox1" />
        <input type="button" value="Test" onclick="javascript:TestOnClosefunction()" />
    </div>
</form>
<script type="text/javascript">
    function TestOnClosefunction() {
        var textBox = document.getElementById('<%= HardwareSNTextBox1.FindControl("AutoCompleteTextBox").ClientID %>');
        console.log(textBox.value);
    }
</script>