如何使用 JQuery 将 Web 控件识别为客户端对象答案

【问题标题】：How to recognize a Web Control as a Client Object with JQuery如何使用 JQuery 将 Web 控件识别为客户端对象
【发布时间】：2015-07-03 19:35:14
【问题描述】：

谁能帮助我如何使用 Jquery 识别或捕获自定义 Web 控件并访问其客户端功能？

我在 asc.net 中创建了一个 Web 控件（.ascx），就像示例中一样。

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

<asp:Panel ID="myPanel" runat="server">
     <asp:TextBox ID="myText" runat="server" />
</asp:Panel>

<script type="text/javascript">
     function showMessage(){ 
          var txt = $('<%= this.myText.ClientID %>')
          alert(txt.val());
     }
</script>

然后，我想将此控件放置在网络表单 (.aspx) 中的转发器中

<table>
<asp:Repeater ID="myRepeater" runat="server">
<ItemTemplate>
 <tr>
 <td>
 <Pre:MyControl ID="myControl" runat="server" />
 <input type="button" id="myButton" onclient="sendData(this);" />
 </td>
 </tr>
</ItemTemplate>
</asp:Repeater>
</table>

在同一页面中，我想管理我对当前行的控制，我点击旁边的按钮，这是我的疑问。

在我的函数 sendData 中，我想做这样的事情：

function sendData(sender){
 var row = $(sender).closest('tr');
 var ccontrol = row.find(*******) // 1. 
 ccontrol.showMessage(); // 2. 
}

在这里，我想用 Jquery 来控制我。我可以通过 ID 找到它，例如 row.find([id*='myControl'])，但我如何才能将其识别为对象。
这里我要调用当前控件的客户端函数

编辑：当我这样做时：

var ccontrol = row.find("[id*='myControl']");

我在开发者工具中得到这个（调试）

<div id="myRepeater_myControl_4_myPanel_4">
    <div id="myRepeater_myControl_4_myPanel_4">
    <input name="myRepeater$ctl04$myControl$myText" type="text" value="hello world" id="myRepeater_myControl_4_myText_4">
</div>
 ,
<input name="myRepeater$ctl04$myControl$myText" type="text" value="hello world" id="myRepeater_myControl_4_myText_4">

我很高兴知道如何将它作为一个对象获取并访问 showMessage()。

当我的控件被渲染时，我可以在视图源中看到转发器正在 html 中显示我的控件，并且对于每个控件，函数 showMessage 单独显示。我想把它封装起来。

【问题讨论】：

标签： javascript c# jquery asp.net web-controls

【解决方案1】：

由于我无法发表评论，所以我将其写为答案：
我不太了解 aspx 模板，但请尝试查看 MSDN
我猜它应该是类似onclientclick 属性而不是onclient 以便引用元素的点击处理程序。

【讨论】：

【解决方案2】：

你应该能够使用 jQuery 获得任何你想要的控制：

var yourControl = $("#yourcontrolid");

如果您希望它是 object，只需执行以下操作：

var yourControlAsObject = $("#yourcontrolid")[0];

编辑：已更新以回答评论。

编辑#2：

如果您只包含一次脚本函数并为您的用户控件 (yourusercontrol.js) 包含一个包含，它会更好吗？如果您查看您的HTML，showMessage 的定义不是一遍又一遍地出现吗？

您可以将showMessage 函数更改为如下所示：

function showMessage(controlID){ 
    var txt = $('#' + controlID);  // you didn't have the # in your example
    alert(txt.val());
}

然后在你的sendData 函数中：

function sendData(sender){
    var row = $(sender).closest('tr');
    var ccontrol = row.find(*******)  // 1.
    showMessage(ccontrol.attr('id')); // 2. 
}

不确定这是否是您真正想要的，但也许这种方法至少可以帮助您前进。

【讨论】：

我不明白你的回答。我想用 JQuery 找到我的控件，但作为一个对象和一个对象来访问其客户端方法。
感谢您的回答。我之前的更新，它在开发工具的控制台中将我的控件显示为一个简单的文本，但添加 [0] 它看起来像“包装”，但我仍然无法访问控件内的 javascript。我想将我的 Web 控件识别为对象，以便访问其客户端行为。
我在您的示例中没有看到 showMessage 是如何专门与您的控件相关联的？在Repeater 中，函数脚本只会为具有不同客户端 ID 的每一行复制，但函数本身仍然是相同的。

【解决方案3】：

嗯，实际上答案并不短。答案就在这个来自微软的article。

希望这可以帮助某人。

【讨论】：