将div做成服务器控件并添加单击事件
2010-08-07 11:33
393 查看
根据基础的asp.net知识,写个demo:
HTML code
C# code
举一个“更好地封装”的例子。给某个asp.net组件添加click事件就将这个行为封装到一个ascx中去!
HTML code
C# code
这个ascx是实现上面说的那个接口的,也就是说它要把回发引导它自己。然后,有一个TargetID属性你可以用于设置它要控制的组件的ID。当它工作时,它向TargetID标记出的控件注入(attach)一个客户端onclick事件,当客户在页面上点击那个控件时,这个ascx的Click事件就被触发了!
还是用前面的demo,这回要写的代码简单多了,只要把这个ascx用鼠标拖入要控制的控件的旁边放下,声明两个属性:
HTML code
C# code
如果你需要控制哪一个控件为它加上单击事件,就把这个“单击”行为工具拖到它的旁边放下,然后简单地设置一下TargetID属性和click事件就行了。
HTML code
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <title></title> </head> <body> <form id="form1" runat="server"> <asp:ScriptManager ID="ScriptManager1" runat="server"> </asp:ScriptManager> <asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional"> <ContentTemplate> <div runat="server" id="myDiv"> click me </div> </ContentTemplate> </asp:UpdatePanel> </form> </body> </html>
C# code
using System; using System.Web.UI; public partial class _Default : System.Web.UI.Page, IPostBackEventHandler { protected void Page_Load(object sender, EventArgs e) { this.myDiv.Attributes["onclick"] = this.Page.ClientScript.GetPostBackEventReference(this.Page,"点击myDiv"); } public void RaisePostBackEvent(string eventArgument) { if (eventArgument == "点击myDiv") ScriptManager.RegisterStartupScript(this, this.GetType(), this.GetHashCode().ToString(), "alert('点击了myDiv');", true); } }
举一个“更好地封装”的例子。给某个asp.net组件添加click事件就将这个行为封装到一个ascx中去!
HTML code
<%@ Control Language="C#" AutoEventWireup="true" CodeFile="WebUserControl.ascx.cs" Inherits="WebUserControl" %>
C# code
using System; using System.Web.UI; using System.Web.UI.HtmlControls; using System.Web.UI.WebControls; public partial class WebUserControl : System.Web.UI.UserControl, IPostBackEventHandler { public string TargetID { get; set; } public event EventHandler<EventArgs> Click; public void RaisePostBackEvent(string eventArgument) { if (this.Click != null) this.Click(this, EventArgs.Empty); } protected void Page_PreRender(object sender, EventArgs e) { var ctl = this.Parent.FindControl(this.TargetID); var script = this.Page.ClientScript.GetPostBackEventReference(this, string.Empty); if (ctl is HtmlControl) ((HtmlContainerControl)ctl).Attributes["onclick"] = script; else if (ctl is WebControl) ((WebControl)ctl).Attributes["onclick"] = script; else if(ctl is WebUserControl) ((WebUserControl)ctl).Attributes["onclick"] = script; } }
这个ascx是实现上面说的那个接口的,也就是说它要把回发引导它自己。然后,有一个TargetID属性你可以用于设置它要控制的组件的ID。当它工作时,它向TargetID标记出的控件注入(attach)一个客户端onclick事件,当客户在页面上点击那个控件时,这个ascx的Click事件就被触发了!
还是用前面的demo,这回要写的代码简单多了,只要把这个ascx用鼠标拖入要控制的控件的旁边放下,声明两个属性:
HTML code
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %> <%@ Register Src="WebUserControl.ascx" TagName="WebUserControl" TagPrefix="uc1" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <title></title> </head> <body> <form id="form1" runat="server"> <asp:ScriptManager ID="ScriptManager1" runat="server"> </asp:ScriptManager> <asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional"> <ContentTemplate> <div runat="server" id="myDiv"> click me </div> <uc1:WebUserControl ID="WebUserControl1" runat="server" TargetID="myDiv" OnClick="myDiv_Clicked" /> </ContentTemplate> </asp:UpdatePanel> </form> </body> </html>
C# code
using System; using System.Web.UI; public partial class _Default : System.Web.UI.Page { protected void myDiv_Clicked(object sender, EventArgs e) { ScriptManager.RegisterStartupScript(this, this.GetType(), this.GetHashCode().ToString(), "alert('点击了myDiv');", true); } }
如果你需要控制哪一个控件为它加上单击事件,就把这个“单击”行为工具拖到它的旁边放下,然后简单地设置一下TargetID属性和click事件就行了。
相关文章推荐
- 为服务器控件添加javascript客户端事件
- 为服务器控件添加javascript客户端事件
- 为服务器控件添加javascript客户端事件(zz)
- 给控件添加单击事件--UITapGestureRecognizer
- 向 ASP.NET Web 服务器控件添加客户端脚本事件
- JS触发服务器控件的单击事件
- 给控件添加单击事件--UITapGestureRecognizer
- JS触发服务器控件的单击事件(详解)
- 为服务器控件添加javascript客户端事件
- 为服务器控件添加javascript客户端事件
- JS触发服务器控件的单击事件
- asp.net 服务器控件LinkButton等在后台代码中设置js事件或添加css样式
- asp.net中服务器控件如何添加客户端的js事件?
- 对于服务器控件asp:Button单击事件失效问题汇总
- 给控件添加单击事件--UITapGestureRecognizer
- 给控件添加单击事件--UITapGestureRecognizer
- DataGrid控件中模板列的服务器控件,怎么添加事件代码
- 给服务器控件button添加一个在onclick之前的js事件
- QT重写控件函数并添加鼠标单击事件
- 给控件添加单击事件--UITapGestureRecognizer