0

有一个带有按钮的自定义控件。有一个外部 javascript 文件试图将一些事件附加到我的控件。就像在运行时将 onclick 事件添加到按钮一样。为此，我使用

var save = document.getElementById("btnExecute");

这个控件是从我附加了 JS 文件的 aspx 页面调用的。该页面无法正常工作，我阅读了如果我将代码更改为类似的内容它将起作用的文章

var save = document.getElementById("<%= btnExecute.ClientID %>");

但仅当 JS 在 aspx 文件中时才有效。如何使其适用于自定义控件。我需要遵循哪些步骤才能使外部 JS 上的 ID 正常工作？

尝试了 Ajax81 的解决方案：添加代码

namespace MyCompositeControl
{
    public class MyGrid : CompositeControl
    {
        public string ButtonClientID
        {
            get { return btnExecute.ClientID; }
            set { }
        }

        protected override void CreateChildControls()
        {
            #region Execute Button
            btnExecute.ID = "btnExecute";
            btnExecute.Text = "Execute"; 
            btnExecute.Click += new EventHandler(_button_Click);
            Controls.Add(btnExecute);
            #endregion
    }
        protected override void OnPreRender(EventArgs e)
        {
            base.OnPreRender(e);
            string jsResourceName = "MyCompositeControl.Scripts.ControlScriptLibrary.js";
            ClientScriptManager cs = this.Page.ClientScript;
            cs.RegisterClientScriptResource(typeof(this,GetType()), jsResourceName);
        }
}

如您在上面的代码中所见，按钮是动态添加的。

ControlScriptLibrary.js

  function attachEvents()
   {   
       //var save = document.getElementById("btnExecute");
       var save = document.getElementById("<%=MyGrid.ButtonClientID%>");
       if(save!=null)
       { 
        save.onclick = onSaveAction;
       }
   }

编辑：仍然返回null。难道是，JS先运行，控件还没出现？但是，如果我像这样传递控件 ID，则此方法有效：

function MyController(executeButtonID, onSaveEventHandler)
{
    function attachEvents()
    {   
        //var save = document.getElementById("btnExecute");
        var save = document.getElementById(executeButtonID);
        if(save!=null)
        { 
            save.onclick = onSaveAction;
        }
    }
}

在我的控件的 RenderContent 方法中，我有以下 javascript 代码：

var myController = new MyController(this.btnExecute.ClientID, onSaveEventHandler);

如果我在控件上有更多按钮并且需要在 JS 中进行一些事件处理，那么这种方法将会终止。Ajax81 的解决方案很好，但它对我还不起作用。

4

2 回答 2

0

在 .NET 中，当控件嵌套在窗体中时，控件的名称也采用其父项的名称。例如，在输出 HTML 时，名称为“ComboBox1”的对象可能会像“ctl00_content_ctl00_ComboBox1”一样结束。如果您需要在浏览器运行时通过其 id 来引用按钮，那么您可以检查生成的 HTML 代码并查看按钮的最终名称是什么，然后在您的 JS 中使用它。请注意，如果任何按钮父对象的名称发生更改，则按钮的名称可能会更改。因此，这不是一个很好的解决方案，尤其是当您可能在页面上有许多此类控件时。

有一些 JavaScript 框架，例如 jQuery 和 Prototype，它们提供了一些工具，让您可以更轻松地在 DOM 中查找对象并附加事件。

于 2011-02-15T16:09:25.563 回答
0

为自定义控件创建一个属性，该属性返回您需要在 javascript 中寻址的按钮的客户端 ID。

您的代码最终看起来像这样：

在您的自定义控件代码中：

public string SaveButtonID
{
   get { return SaveButton.ClientID }
   set {/*nothing*/;}
}

在你的 JavaScript

var save = document.getElementById('<%=MyCustomControl.SaveButtonID%>");

编辑 修正了 javascript 中的错字。

于 2011-02-15T16:37:51.583 回答