Question

我在母版页中有2个div标签。当我移动mouseover 1 div标签时，应显示另一个div标签。 JQuery代码在.js文件中。当我把.js文件放在内容页面中时，jquery工作正常。当我将.js文件移动到母版页时，jquery代码不起作用。我需要jQuery在Master页面中，因为需要从所有内容页面访问div标签。我是jQuery的新手，任何帮助都将受到赞赏。

代码： .js文件中的jQuery代码

$(function () {
    alert("Hello");
    $("nav").hide();
    $("#divSignAccount").mouseover(function () {
        $("nav").show();
    });
    $("nav").mouseover(function () {
            $("nav").show();
        });
    $("nav").mouseout(function () {
        $("nav").hide();
    });
});

母版页代码：

<html lang="en">
<head runat="server">
     <script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jquery/jquery-

1.7.1.min.js"></script>

    <script src="../Script/BookStore.js" type="text/javascript"></script>  
    <asp:ContentPlaceHolder id="head" runat="server">        

    </asp:ContentPlaceHolder>

</head>
<body>    
    <form id="form1" runat="server">                      
        <!-- Header -->
        <header>
            <!-- Sign In dropdown -->
            <div id="divSignAccount" class="divSignIn">
            <asp:HyperLink ID="hlSignIn" runat="server" CssClass="displayText">Sign In</asp:HyperLink><br />
            <asp:HyperLink ID="hlYourAccount" runat="server" CssClass="text">Your Account</asp:HyperLink><br />
            </div><br>            
        </header>     
        <nav>
            <div id="divDD">
                <div id="divSignNew">
                    <asp:Button ID="btnSignIn" runat="server" Text="Sign in" CssClass="signInBtn" /><br />
                    <asp:Label ID="Label1" runat="server" Text="New Customer?" CssClass="text"></asp:Label>&nbsp;
                    <asp:HyperLink ID="hlNew" runat="server" CssClass="text">Start Here</asp:HyperLink><br />
                </div>
                <div id="divUser">         
                    <asp:HyperLink ID="hlAccount" runat="server" CssClass="text">Your Account</asp:HyperLink><br />
                    <asp:HyperLink ID="hlOrders" runat="server" CssClass="text">Your Orders</asp:HyperLink><br />            
                    <asp:HyperLink ID="hlManageReview" runat="server" CssClass="text">Manage Reviews</asp:HyperLink><br />
                </div>
                <div id="divAdmin" runat="server">
                    <asp:HyperLink ID="hlCategory" runat="server" CssClass="text">Category</asp:HyperLink><br />
                    <asp:HyperLink ID="hlBooks" runat="server" CssClass="text">Books</asp:HyperLink><br />
                    <asp:HyperLink ID="hlUOS" runat="server" CssClass="text">UserOrderStatus</asp:HyperLink><br />
                </div>
            </div>
       </nav> 

...

jQuery代码不会触发。

如果我在内容页面中放置js脚本标记jQuery代码可以正常工作。

感谢任何帮助。感谢。

Answer 1

在主页面部分类型中：

<script src='<%# ResolveUrl("~/Script/BookStore.js")%>' type="text/javascript"></script>

在主页面页面加载事件处理程序中输入以下代码：

Page.Header.DataBind();

这很有效。

Answer 2

在主人面前尝试这个头。我的主人的位置在根。 Javascript位于Scripts文件夹中。我尝试你的代码，它的工作。我尝试使用“Applications Web Form ASP.NET”模板visualstudio 2012

<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <meta charset="utf-8" />
    <title><%: Page.Title %> - Applicazione ASP.NET</title>
    <asp:PlaceHolder runat="server">        
        <%: Scripts.Render("~/bundles/modernizr") %>
    </asp:PlaceHolder>
    <webopt:BundleReference runat="server" Path="~/Content/css" /> 
    <link href="~/favicon.ico" rel="shortcut icon" type="image/x-icon" />
    <meta name="viewport" content="width=device-width" />
    <asp:ContentPlaceHolder runat="server" ID="HeadContent" />
        <script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jquery/jquery-1.7.1.min.js"></script>
      <script src="Scripts/bookstore.js"></script>

</head>

Answer 3

将脚本放在$（document）.ready（function（）{.... your script here ...}）; 因此当dom准备就绪时它会被破坏

.js脚本文件包含不从母版页执行的jquery

3 个答案: