如何在 js/jquery 中访问 usercontrol 值答案

【问题标题】：how to access usercontrol value in js/jquery如何在 js/jquery 中访问 usercontrol 值
【发布时间】：2016-12-12 06:12:28
【问题描述】：

假设我创建了一个包含两个文本框，一个按钮的用户控件

 --Start UserControl UserDetails--
 <asp:TextBox runat="server" id="txtName"></asp:TextBox>
 <asp:TextBox runat="server" id="txtAddress"></asp:TextBox>
--End UserControl UserDetails-

如果我使用相同的用户控件，则在 aspx 中，

<uc1:UserDetails runat="server" ID="UserDetails1" />

如何使用用户控件 ID UserDetails1 访问 txtName？
我如何使$('#UserDetails1').val() 返回txtName 的值？

【问题讨论】：

我相信是$("#txtName").val()，但是页面上显示的渲染html会显示最终的输入ID。
$("#txtName").val() 会起作用，我很清楚。但关于用户控件 ID，我应该能够访问文本框值。 $('userControl').Val() 应该返回第一个文本框值

标签： javascript c# jquery asp.net webusercontrol

【解决方案1】：

试试这个，使用 Jquery

$("[id$='txtName']").val();
$("[id$='txtAddress']").val();

【讨论】：

【解决方案2】：

只需在你的用户控制代码中为你添加一个公共属性TextBox

public TextBox Name
{
    get { return txtName; }
    set { txtName = value; }
}

现在您可以像这样访问您的TextBox：

<uc1:UserDetails runat="server" ID="UserDetails1" />

    <script>
        $(function () {
            $("#<%= UserDetails1.Name.ClientID%>").val("set you text here");
            //or
            var name = $("#<%= UserDetails1.Name.ClientID %>").val();
        });
    </script>

【讨论】：

【解决方案3】：

在文本框中使用数据键。

      --Start UserControl UserDetails--
     <asp:TextBox runat="server" id="txtName" data-key="name"></asp:TextBox>
     <asp:TextBox runat="server" id="txtAddress" data-key="address"></asp:TextBox>
    --End UserControl UserDetails-

<uc1:UserDetails runat="server" ID="UserDetails1" data-usercontrol = "UserDetails1" />

在 jquery 中，

$("[data-usercontrol='UserDetails1']").find("[data-key='name']").val();
$("[data-usercontrol='UserDetails1']").find("[data-key='address']").val();

您可以使用 id 选择器。但是由于你使用过asp.net，它在HTML中可能会以不同的id呈现。

希望这会有所帮助！

【讨论】：