如何在同一页面上将Jquery与两个相同的用户控件一起使用。

本文介绍了如何在同一页面上将Jquery与两个相同的用户控件一起使用。的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！ 问题描述 嗨人们 我正在尝试编写一个可供第三方使用的控件，我在同一页面上引用多个用户控件时遇到问题。控件是相同的类型。 我知道我可以使用ClientID引用不同版本的控件，但这确实意味着每当创建新的客户端ID时都必须更新Jquery（通过向ASPX页面添加一个新控件。） 显示的代码工作正常，当我控制aspx页面时，这是一个可行的解决方案。但是，如果第三方要使用此控件，则必须根据控件的任何用法更改javascript。 我相信一定有更好的OO型解决方案，但我找不到它。 非常感谢帮助 ASCX文件： （代码背后没有变化） <％@ 控制 语言 = C＃ AutoEventWireup = true CodeBehind = InputInformation.ascx的.cs 继承 = AscesisUserControlTest.Controls.TestControl.InputInformation ％> < table > < tr > < td > < label > ; 请输入您的姓名：< / label > < / td > < td > < 输入 id = NameInput / > < / td > < / tr > < tr > < td > < 标签 > 请输入您的地址：< / label > < / td > < td > < 输入 id = AddressInput / > < / td > < / tr > < tr > < td > < input class = SubmitButton <％ = ClientID ％> type = 提交 value = submit / > < / td > < / tr > < / table > Javascript文件： jQuery（document）.ready （function（） { $（'。SubmitButtonInputControl'）。click（function（e） { e.preventDefault（）; if（e.target == this） { alert（你好）; } }）; $（'。SubmitButtonInputControl1'）。click（function（e）{ e.preventDefault（）; if（e.target == this） { alert（第二控制）; } }）; }）; 使用控制权： < div > < Ascesis：InputControl runat = server id = InputControl > < / Ascesis ：InputControl > < Ascesis：InputControl runat = server id = InputControl1 > < / Ascesis：InputControl > < / div > ; 我还想指出，这是一个简单的例子，真正的应用程序要复杂得多。解决方案 （'。SubmitButtonInputControl'）。click（function（e） { e.preventDefault（）; if（e.target == this） { alert（你好）; } }）; （'。SubmitButtonInputControl1'）。click（function（e）{ e.preventDefault（）; if（e.target == this） { alert（Second control）; } }）; }）; 使用控制权： < div > < Ascesis：InputControl runat = server id = InputControl > < / Ascesis ：InputControl > < Ascesis：InputControl runat = server id = InputControl1 > < / Ascesis：InputControl > < / div > ; 我还想指出，这是一个简单的例子，真正的应用程序要复杂得多。 看看那里;） http://stackoverflow.com/questions/2867412/how-to-use-multiple-instances-of-a-usercontrol-with- jquery在同一页面上 [ ^ ] Hi PeopleI am trying to write a control that can be used by third parties and I have a problem referencing Multiple User Controls on the same page. The controls are the same type. I am aware that I can reference different versions of the control using the ClientID but this does mean that the Jquery has to be updated whenever a new client id is created (by adding a new control to the ASPX page).The code shown does work OK, and this is a workable solution when I am in control of the aspx page. However if a third party was to use this control they would have to alter the javascript in line with any usages of the control.I am sure there must be a better OO type solution but I cannot find it.Help would be very much appreciatedASCX File:(Code behind has no changes)<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="InputInformation.ascx.cs" Inherits="AscesisUserControlTest.Controls.TestControl.InputInformation" %><table> <tr> <td> <label>Please input your name :</label> </td> <td> <input id="NameInput" /> </td> </tr> <tr> <td> <label>Please input your address :</label> </td> <td> <input id="AddressInput" /> </td> </tr> <tr> <td> <input class="SubmitButton<%=ClientID%>" type="submit" value="submit" /> </td> </tr></table>Javascript file:jQuery(document).ready(function (){ $('.SubmitButtonInputControl').click(function (e) { e.preventDefault(); if (e.target == this) { alert("Hello"); } }); $('.SubmitButtonInputControl1').click(function (e) { e.preventDefault(); if (e.target == this) { alert("Second control"); } });});Use of control:<div> <Ascesis:InputControl runat="server" id="InputControl"></Ascesis:InputControl> <Ascesis:InputControl runat="server" id="InputControl1"></Ascesis:InputControl></div>I would also like to point out that this is a simple example the real application is far more complex. 解决方案 ('.SubmitButtonInputControl').click(function (e) { e.preventDefault(); if (e.target == this) { alert("Hello"); } });('.SubmitButtonInputControl1').click(function (e) { e.preventDefault(); if (e.target == this) { alert("Second control"); } });});Use of control:<div> <Ascesis:InputControl runat="server" id="InputControl"></Ascesis:InputControl> <Ascesis:InputControl runat="server" id="InputControl1"></Ascesis:InputControl></div>I would also like to point out that this is a simple example the real application is far more complex.Take a look there ;)http://stackoverflow.com/questions/2867412/how-to-use-multiple-instances-of-a-usercontrol-with-jquery-on-the-same-page[^] 这篇关于如何在同一页面上将Jquery与两个相同的用户控件一起使用。的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！