gpt4 book ai didi

javascript - 当我们在asp.net中有相同用户控件的多个实例时,如何获得正确的控件ID?

转载 作者:行者123 更新时间:2023-12-03 10:02:27 26 4
gpt4 key购买 nike

我有一个带有 2 个按钮(Button1、Button2)和 1 个文本框(TextBox1)的用户控件。在 Button1 Clientclick 上,我尝试获取 Button1 的 ControlID。

在主页中我有两个相同用户控件的实例。当单击第一个用户控件按钮1时,我得到了最后一个用户控件ID(这里我有两个控件)

UserControl1.Button1click给出:MyUserControl2_Button1(假设显示MyUserControl1_Button1),请澄清问题出在哪里。我感谢您的帮助。谢谢 enter image description here

<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="MyUserControl.ascx.cs" Inherits="UserControlProject.UserControl.MyUserControl" %>

<script type="text/javascript">
function button1client(ctrl) {
alert(document.getElementById("<%= Button1.ClientID %>").id);
}
function button2client(ctrl) {
alert(document.getElementById("<%= Button2.ClientID %>").id);
}
</script>

<table width="100" border="1" runat="server">
<tr>
<td>
<table width="100%" align="right" runat="server">
<tr>
<td>
<asp:Button ID="Button1" runat="server" Text="Button1" OnClick="Button1_Click" OnClientClick="button1client(this);return false;" />
<asp:Button ID="Button2" runat="server" Text="Button2" OnClick="Button2_Click" OnClientClick="button2client(this);return false;" />
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td>
<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
</td>
</tr>
</table>


MainPage.aspx

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="TestUserControl.aspx.cs" Inherits="UserControlProject.TestUserControl" %>

<%@ Register Src="~/UserControl/MyUserControl.ascx" TagPrefix="uc1" TagName="MyUserControl" %>


<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">

<div>
<table width="100%">
<tr>
<td>
<uc1:MyUserControl runat="server" ID="MyUserControl1" />
</td>
<td>
<uc1:MyUserControl runat="server" ID="MyUserControl2" />
</td>
</tr>
</table>
</div>

</form>
</body>
</html>

页面源显示:

<script type="text/javascript">
function button1client(ctrl) {
alert(document.getElementById("MyUserControl1_Button1").id);
}
function button2client(ctrl) {
alert(document.getElementById("MyUserControl1_Button2").id);
}
</script>

<table width="100" border="1">
<tr>
<td>
<table width="100%" align="right">
<tr>
<td>
<input type="submit" name="MyUserControl1$Button1" value="Button1" onclick="button1client(this);return false;" id="MyUserControl1_Button1" />
<input type="submit" name="MyUserControl1$Button2" value="Button2" onclick="button2client(this);return false;" id="MyUserControl1_Button2" />
</td>
</tr>
</table>

</td>
</tr>
<tr>
<td>
<input name="MyUserControl1$TextBox1" type="text" id="MyUserControl1_TextBox1" />
</td>
</tr>
</table>


</td>
<td>




<script type="text/javascript">
function button1client(ctrl) {
alert(document.getElementById("MyUserControl2_Button1").id);
}
function button2client(ctrl) {
alert(document.getElementById("MyUserControl2_Button2").id);
}
</script>

<table width="100" border="1">
<tr>
<td>
<table width="100%" align="right">
<tr>
<td>
<input type="submit" name="MyUserControl2$Button1" value="Button1" onclick="button1client(this);return false;" id="MyUserControl2_Button1" />
<input type="submit" name="MyUserControl2$Button2" value="Button2" onclick="button2client(this);return false;" id="MyUserControl2_Button2" />
</td>
</tr>
</table>

</td>
</tr>
<tr>
<td>
<input name="MyUserControl2$TextBox1" type="text" id="MyUserControl2_TextBox1" />
</td>
</tr>
</table>


</td>
</tr>
</table>
</div>

最佳答案

这是提升的结果。基本上这就是 javascript 的工作方式。为了更好地理解它,请在运行时检查页面源代码。我会尽力在这里解释一下。

当您运行 ASP.NET 应用程序时,它会加载这两个用户控件(因为它们都位于主页中)。

两个控件都有同名的 JavaScript 方法。

第一个控件加载此:

function button1client(ctrl) {
alert(document.getElementById("MyUserControl1_Button1").id);
}
function button2client(ctrl) {
alert(document.getElementById("MyUserControl1_Button2").id);
}

加载具有相同函数名称的第二个用户控件。

function button1client(ctrl) {
alert(document.getElementById("MyUserControl2_Button1").id);
}
function button2client(ctrl) {
alert(document.getElementById("MyUserControl2_Button2").id);
}

提升后的 Javascript 会覆盖旧函数。它们不再存在于 javascript 上下文中。因此,当单击任何按钮时,都会调用第二个控件的方法。

希望对您有所帮助。

关于javascript - 当我们在asp.net中有相同用户控件的多个实例时,如何获得正确的控件ID?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30519525/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com