getElementById 引用 Null（从 Javascript 调用）答案

【问题标题】：getElementById referencing Null (called from Javascript)getElementById 引用 Null（从 Javascript 调用）
【发布时间】：2014-10-11 04:58:13
【问题描述】：

我在 iframe 中编写了 Javascript 代码，它修改了父窗口内容占位符中 hiddenfield 的值，并且触发按钮的点击事件，并设置 iframe 的可见性。它们都被错误地引用。

iframe 中的 JavaScript：

 <script type="text/javascript">
      function ChangeView(obj) {

          parent.document.getElementById("HiddenField1").value = $(obj).attr('id');
          parent.document.getElementById("Button1").click();
          var iframe = parent.document.getElementById("newsFrame");
          iframe.style.display = "block";

      }

    </script>
</head>
<body>


 <form id="f">
    <nav>
      <ul id="nav">
        <li><a id="aHome"  href="#" onclick="ChangeView(this)" >Home</a></li>   
        <li><a href="#">About</a>
          <ul>
            <li><a id="aMessage" href="#" onclick="ChangeView(this)">Message</a></li>

          </ul>
        </li>
      </ul>
    </nav>
 </form>
</body>

父页面：

<asp:Content ID="Content3"  ContentPlaceHolderID="ContentPlaceHolder2" runat="server">
   <html xmlns="http://www.w3.org/1999/xhtml" > 

<head>
    <title> </title>
<script runat="server">

    Sub ChangeView()
        Dim t As HiddenField
        ' Dim mc As Control = FindControl("Label1")
        t = FindControl("HiddenField1")
        Dim m As MultiView
        m = FindControl("Multiview1")

        If (t.Value = "aHome") Then
            m.ActiveViewIndex = 0

        End If
        If (t.Value = "aMessage") Then
            m.ActiveViewIndex = 1
        End If

    End Sub

   </script>

</head>

<body>
   <form id="form1" runat="server">

   <asp:Button ID="Button1" runat="server"  Visible="True" OnClick="ChangeView"  />

       <asp:ScriptManager ID="SM1" runat="server" />

<asp:UpdatePanel ID="UpdatePanel1" runat="server">
        <ContentTemplate>
        <asp:HiddenField ID="HiddenField2"  runat="server"  />
         <asp:MultiView ID="MultiView2" runat="server" ActiveViewIndex="0">
            <asp:View ID="View8" runat="server">
                This is HOME 
            </asp:View>
            <asp:View ID="View9" runat="server">
                This is DEPARTMENT MESSAGE 
            </asp:View>

        </asp:MultiView>
        <br /><br />


        </ContentTemplate>
    </asp:UpdatePanel>
   </form>

</body>
</html>
                <iframe src="dept-menu/index.html" width="100%" height="650px" scrolling="no" frameborder="0"></iframe>

                    <iframe id="newsFrame" src="dept-news/news.html" width="100%" height="300px" scrolling="no" frameborder="0"></iframe>



</asp:Content>

HTML

 <input type="submit" name="ctl00$ContentPlaceHolder2$Button1" value="" id="Button1" />


       <script type="text/javascript">
//<![CDATA[
Sys.WebForms.PageRequestManager._initialize('ctl00$ContentPlaceHolder2$SM1', 'form1', ['tctl00$ContentPlaceHolder2$UpdatePanel1','ContentPlaceHolder2_UpdatePanel1'], [], [], 90, 'ctl00');
//]]>
</script>



<div id="ContentPlaceHolder2_UpdatePanel1">

        <input type="hidden" name="ctl00$ContentPlaceHolder2$HiddenField1" id="HiddenField1" />

                This is HOME 

        <br /><br />



</div>

在运行时，错误提示他们无法设置空引用的值。我做错了什么？提前致谢。

附注从内容占位符调用 iframe。

【问题讨论】：

当是 JavaScript+HTML 问题时，你为什么显示 JavaScript+ASP.NET？显示 HTML。
@Quentin 我是个新手，但我认为 ASP.NET 不能有 HTML 声明，因为它的 Masterpage 中有一个。我想我还没有掌握整个 HTML/ASP.NET 集成概念
——这和什么有什么关系？向我们展示您发送到浏览器的 HTML，而不是您用来生成它的 ASP。
@Quentin，我编辑了，我希望这就是你的意思
父页面代码仍然显示为 ASP 而不是 HTML。

标签： javascript html asp.net iframe

【解决方案1】：

简单添加

      parent.document.getElementById("ContentPlaceHolder2_HiddenField1").value = $(obj).attr('id');

而不是

      parent.document.getElementById("HiddenField1").value = $(obj).attr('id');

【讨论】：