即使在document.ready(.aspx)之后,DOM也无法用于JS文件

时间:2017-02-28 15:14:03

标签: javascript c# asp.net

在我们的工作场所,一位老的.net开发人员设置我们使用.aspx页面,每个页面都有一个,以及一个母版页

我的问题是,在我们的主人内部,我们包含对每个页面都是唯一的元素的引用,在下面的示例中,它是我们已加载的页面的标签名称

例如

Page1.aspx的

<asp:Content ContentPlaceHolderID="tabContent" runat="server">
    <ul id="tabList">
        <li class-">Custom Tab 1</li>
        <li class-">Custom Tab 2</li>
    </ul>
</asp:Content>

Page2.aspx

<asp:Content ContentPlaceHolderID="tabContent" runat="server">
    <ul id="tabList">
        <li class-">Custom Tab 1</li>
        <li class-">Custom Tab 2</li>
        <li class-">Custom Tab 3</li>
        <li class-">Custom Tab 4</li>
    </ul>
</asp:Content>

Page3.aspx

<asp:Content ContentPlaceHolderID="tabContent" runat="server">
    <ul id="tabList">
        <li class-">Custom Tab 123</li>
        <li class-">Custom Tab 456</li>
        <li class-">Custom Tab 789</li>
    </ul>
</asp:Content>

MasterPage.aspx

<head runat="server">
    <link href="/css/bootstrap.css" rel="stylesheet" />
    <link href="/css/fontawesome.css" rel="stylesheet" />
</head>
<body>
    <div id="tabMenu" runat="server">
        <asp:ContentPlaceHolder runat="server" ID="tabContent" />
    </div>

    <script src="menu_functions"></script>
</body>

menu_functions.js

function menu_functions(){

    $(document).ready(function(){

        // Try to do stuff with the <li's> we've defined in each page, but they are never available

        document.getElementByID("tabList"); // Not available, If we set a breakpoint here I can see the tabs are not in the DOM

    )};

    // Window.ready also doesn't work

    // The tabs will get drawn to the DOM after both the document.ready / window.onload events have already fired

}

如果有人能够解释通过客户端JS访问这些元素的正确方法,一旦它们在DOM中可用,我们将非常感激。

0 个答案:

没有答案