本文旨在给大家开发自定义控件（结合js）一个思路，一个简单的示例，可能在实际项目中并不会这样做。

先来看看效果：

1.在静态页面里开发好想要的效果

jQuery.extend({ openloading: function (options) { var defaults = { msg: '数据提交中...', img: 'loading.gif' }; var opts = $.extend(defaults, options); $("body").append("<div></div><div><div><img src='"+opts.img+"'>数据提交中...</div></div>"); var h = $(document).height(); $(".l_overlay").css({ "height": h, 'display': 'block', 'opacity': '0.4' }); $(".l_showbox").stop(true).animate({ 'margin-top': (h / 2 - 58) + 'px', 'opacity': '1' }, 200); }, closeloading: function () { $(".l_showbox").stop(true).animate({ 'margin-top': '250px', 'opacity': '0' }, 400); $(".l_overlay").css({ 'display': 'none', 'opacity': '0' }); $(".l_overlay").remove(); $(".l_showbox").remove(); } });

2.vs新建类库，新建类继承于WebControl

添加属性：

[Description("获取和设置触发器ID"), DefaultValue(""), Browsable(true), Category("杂项")]

public string TargetID { get; set; }

重写OnPreRender方法。方法中注册js脚本，该脚本指示ID为TargetID的控件点击时显示加载层

protected override void OnPreRender(EventArgs e) { if (Page != null && !string.IsNullOrEmpty(TargetID)) { TargetID = GetClientID(TargetID); Page.ClientScript.RegisterClientScriptResource(typeof(Loading), "BoControl.Scripts.Jquery.js"); this.Page.ClientScript.RegisterStartupScript(typeof(string), "BoControl_" + this.ClientID, "$("#" + TargetID + "").on("click",function(){$.openloading({msg:"" + Text + "", img: "" +Page.ClientScript.GetWebResourceUrl(this.GetType(), "BoControl.Images.loading.gif")+ ""});});", true); } base.OnPreRender(e); }

OnPreRender方法中

Page.ClientScript.RegisterClientScriptResource(typeof(Loading), "BoControl.Scripts.Jquery.js");注册JQuery

Page.ClientScript.GetWebResourceUrl(this.GetType(), "BoControl.Images.loading.gif");是获取Web资源文件路径，如果你不想把图片文件嵌入dll请改为真实路径（如：Images/Loading.gif），相反你需要像下面一样指明图片文件和JQuery文件，并且图片属性-生成操作为：嵌入的资源

[assembly: WebResource("BoControl.Images.loading.gif", "image/gif")]//这里你还需注册JQuery

namespace BoControl

{

你还需要写Open方法和Close方法，方便后台代码中调用。

如：

/// <summary> /// 打开加载动画 /// UpdatePanel注册 /// </summary> /// <param name="panel">UpdatePanel对象</param> public void Open(UpdatePanel panel) { if (Page != null) { ScriptManager.RegisterStartupScript(panel, panel.GetType(), "openloading", "$.openloading({msg:"" + Text + "", img: "" + Page.ClientScript.GetWebResourceUrl(this.GetType(), "BoControl.Images.loading.gif"); + ""});", true); } }

总的来说自定义控件的开发不算复杂，以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持查字典教程网。