如何在 ScriptManager.RegisterStartupScript 中包含的 javascript function 中使用 getElementById() 调用 asp 控件

Question

我需要使用 ScriptManager.RegisterStartupScript 在使用 asp.net 的更新面板时运行 javascript function。

我的目标是运行名为 Top10 的 javascript function 和名为 jsonTable 的 json 参数，在这个 function 中，除了var hfield = document.getElementById("<%=hf.ClientID%>");之外，一切都运行良好这应该是获得了 asp.net 的 hiddenfield 控件，但它一直返回 null。我减少了代码，以便我可以达到目的。

c#：

protected void Page_Load(object sender, EventArgs e) {
    if (!IsPostBack) {
        dtCurrentTop1O = dsCurrentTop10Winners.Tables["Top 10 Winners"];
        string strCurrentTop1O = serializer(dtCurrentTop1O);
        ScriptManager.RegisterStartupScript(this.updatePanel1, GetType(), "Javascript",
            "javascript:Top10(" + strCurrentTop1O + ");", true);
    }
}

标记：

<asp:Content ID="Content1" runat="server" ContentPlaceHolderID="head">
  <title></title>
  <script src="Scripts/Top10.js" type="text/javascript"></script>
</asp:Content>
<asp: Content ID="Content2" runat="server" ContentPlaceHolderID="ContentPlaceHolder1">
  <asp: ScriptManager ID="scriptManager1" runat="server"></asp: ScriptManager>
  <asp: UpdatePanel ID="updatePanel1" runat="server">
    <ContentTemplate>
      <asp: Panel ID="Panel1" runat="server">
        <asp: HiddenField ID="hf" runat="server" />
      </asp: Panel>
    </ContentTemplate>
  </asp:UpdatePanel>
</asp:Content>

javascript：Top10.js

function Top10(jsonTable) {
    var chartImg;
    var hfield = document.getElementById("<%=hf.ClientID%>");
};

Answer 1

根据您的描述，您拨打的 function 位于“Top10.js”文件中。 据我所知，ASP.NET 不会解析 ASP.NET 特定文件之外的“<%=hf.ClientID%>”之类的定义 -.js 文件“按原样”（静态内容）传送到 webclient，而不是在服务器端呈现 like.aspx文件。 在浏览器开发工具中查看交付的源代码时，您将能够确认这一点。

您可以将 javascript 代码直接放在您的标记中，以便解析 ClientId，将额外的 hiddenFieldId 参数添加到 TopFiveOutsagesCurrentLC function 或直接在您的 Page_Load 方法中设置 HiddenFields 内容。

Markup中直接js代码的例子：

<asp:Content ID="Content1" runat="server" ContentPlaceHolderID="head">
 <title></title>
 <script type="text/javascript">
  function TopFiveOutagesCurrentLC(jsonTable) {
   var chartImg;
   var hfield = document.getElementById("<%=hf.ClientID%>");
  };
 </script>
</asp:Content>
<asp: Content ID="Content2" runat="server" ContentPlaceHolderID="ContentPlaceHolder1">
 <asp: ScriptManager ID="scriptManager1" runat="server"></asp: ScriptManager>
 <asp: UpdatePanel ID="updatePanel1" runat="server">
   <ContentTemplate>
     <asp: Panel ID="Panel1" runat="server">
      <asp: HiddenField ID="hf" runat="server" />
     </asp: Panel>
   </ContentTemplate>
 </asp:UpdatePanel>
</asp:Content>

Answer 2

我通过找到隐藏字段控件回答了我的问题，然后将其添加到 javascript function 的参数中。

      protected void Page_Load(object sender, EventArgs e) 
          {
          if (!IsPostBack) {
             HiddenField hf = (HiddenField)this.updatePanel1.FindControl("hf");
             dtCurrentTop1O = dsCurrentTop10Winners.Tables["Top 10 Winners"];
             string strCurrentTop1O = serializer(dtCurrentTop1O);
             ScriptManager.RegisterStartupScript(this.updatePanel1, GetType(), 
             "Javascript",
             "javascript:Top10(" + strCurrentTop1O + ","+hf.ClientID+");", true);
              }
           }