找不到javascript元素

javascript element not found

本文关键字：元素 javascript 找不到      更新时间：2023-09-26

我的应用程序中有一个"导出到excel"选项。当我点击该按钮时，我会向用户显示一条确认消息。当用户单击"确定"时，我将使用JavaScript调用一个单击事件。

<asp:Content ID="Content3" ContentPlaceHolderID="PagePlaceholder" runat="Server">
<asp:ScriptManager ID="smMainpage" runat="server">
</asp:ScriptManager>
<table style="width: 100%">
    <tr>
        <td colspan="2">
            <asp:UpdatePanel runat="server" ID="up">
                <ContentTemplate>
                    <div style="text-align: left; font-size: 8pt" id="div5" runat="server">
                        <table width="100%" cellpadding="0" cellspacing="0">
                            <tr>
                                <td align="right" style="width: 50%">
                                    <table>
                                        <tr>
                                            <td style="display: none">
                                                <asp:Button ID="btnblkupdate" runat="server" Text="None" OnClick="btnblkupdate_click" />
                                                <div>
                                                    <asp:Button ID="btnhdnExport" runat="server" OnClick="btnhdnExport_click" /></div>
                                            </td>
                                            <td>
                                                &nbsp;
                                                <asp:LinkButton ID="lnkExport" OnClick="lnkExport_Click" CssClass="customFont" runat="server"
                                                    Text="Export to Excel"></asp:LinkButton>
                                                &nbsp;
                                            </td>
                                            <td>
                                                &nbsp;
                                                <asp:LinkButton ID="lnkbtnFilter" OnClick="lnkbtnFilter_Click" CssClass="customFont"
                                                    runat="server" Text="Filter Data"></asp:LinkButton>
                                                &nbsp;
                                            </td>
                                            <td>
                                                <asp:LinkButton ID="lnkReset" OnClick="lnkReset_Click" Visible="false" CssClass="customFont"
                                                    runat="server" Text="Reset Filter"></asp:LinkButton>
                                                &nbsp;
                                            </td>
                                            <td>
                                                <asp:LinkButton ID="lnkbtnViewAll" OnClick="lnkbtnViewAll_Click" runat="server" Text="View All"></asp:LinkButton>
                                                &nbsp; Selected Records:<asp:Label ID="lblselTsks" Width="20px" Font-Size="10pt"
                                                    Font-Bold="true" runat="server" Text="0"></asp:Label>
                                                &nbsp;
                                            </td>
                                            <td>
                                                Total Records found:&nbsp;<asp:Label ID="lblTotRecCount" Font-Bold="true" runat="server"
                                                    ForeColor="Black" Font-Size="10pt" Text="0"></asp:Label>
                                            </td>
                                        </tr>
                                    </table>
                                </td>
                            </tr>
                        </table>
                    </div>
                </ContentTemplate>
                <Triggers>
                    <asp:PostBackTrigger ControlID="lnkExport" />
                    <asp:PostBackTrigger ControlID="btnhdnExport" />
                </Triggers>
            </asp:UpdatePanel>
            <asp:UpdateProgress ID="UpdateProgress5" EnableViewState="false" AssociatedUpdatePanelID="up"
                DisplayAfter="10" runat="server">
                <ProgressTemplate>
                </ProgressTemplate>
            </asp:UpdateProgress>
        </td>
    </tr>
</table>


protected void lnkExport_Click(object sender, EventArgs e)
{
    DataSet dsResult = new DataSet();
    try
    {
        string strName = string.Empty;
        clsSearch_BL clsObj = new clsSearch_BL();
        //dsResult = (DataSet)Session["SearchRes"];
        if (Session["detObj"] != null)
        {
            DetState detObj = (DetState)Session["detObj"];
            dsResult = clsObj.getSearchResults_BL(detObj);
            HashSet<string> orderIdclmtest = new HashSet<string>();
            int j = dsResult.Tables[0].Rows.Count;
            for (int k = 0; k < j; k++)
            {
               orderIdclmtest.Add( dsResult.Tables[0].Rows[k][1].ToString());
            }
             Session["orderIdclmtest"] = orderIdclmtest.ToString();
            HashSet<string> strtest = new HashSet<string>();
            strtest =(HashSet<string>)Session["orderIdclm"];
            var testttt=strtest.Except(orderIdclmtest).ToList();
            int cnt = testttt.Count;
            StringBuilder str = new StringBuilder();
            for (int i = 0; i < cnt; i++)
            {
                if (str.Length == 0)
                    str.Append(testttt[i]);
                else
                    str.Append(", " + testttt[i]);
            }
            ScriptManager.RegisterClientScriptBlock(this.up, this.GetType(), "export", "hdnExportExcel()", true);
            //if (testttt != null && testttt.Any())
            //{
            //    ScriptManager.RegisterClientScriptBlock(this.up, this.GetType(), "export", "hdnExportExcel('"+str+"')", true);
            //}
        }
    }
    catch (Exception ex)
    {
        log4net.Config.XmlConfigurator.Configure();
        log.Warn("Logging:" + ex);
    }
    finally {
        if(dsResult != null)
        dsResult.Dispose();
    }
}
function hdnExportExcel() {
if (confirm('You are about to miss the tasks do you want to continue?')) {
    document.getElementById('ctl00_PagePlaceholder_btnhdnExport').click();
}
else {
    return false;
}}

我的问题是document.getElementById('ctl00_PagePlaceholder_btnhdnExport')为空。但在页面的源代码中，我可以看到元素ID为ctl00_PagePlaceholder_btnhdnExport

我不知道为什么它不起作用。我猜这是因为更新面板中的postbacktrigger。我尝试将btnhdnExport放置在更新面板之外，并将其从触发器Option中删除。但它没有起作用。有什么建议吗？

提前感谢

正如Ankur所说，在加载JavaScript时（页面是动态创建的），您的元素ID是不可访问的。

我建议更换

document.getElementById('ctl00_PagePlaceholder_btnhdnExport')

至

document.getElementById('btnhdnExport')

UpdatePanel更新时，会替换容器<div>中的所有内容。在调用JS代码时，按钮实际上并不存在。解决这个问题的一种方法是使用.NET的PageRequestManager在UpdatePanel完成任务后调用JS代码。试试这样的东西：

function hdnExportExcel() {
  var prm = Sys.WebForms.PageRequestManager.getInstance();
  prm.add_pageLoaded(function() {
      if (confirm('You are about to miss the tasks do you want to continue?')) {
          document.getElementById('<%= btnhdnExport.ClientID %>').click();
      }
      else {
          return false;
      }
  }
}

您会注意到，我也没有对按钮的ID值进行硬编码。您将希望避免对.NET动态生成的任何id值进行硬编码，因为它们在将来页面结构发生变化时会发生变化。在页面的其他地方进行不相关的更改，并在测试或稍后发现以前稳固的功能现在被破坏，这并不有趣。

相关文章：