ASP.Net 主页和 Javascript 问题

Question

我在母版页中得到以下 HTML 代码

<%@ Master Language="C#" AutoEventWireup="true" CodeFile="MasterPage.master.cs" Inherits="MasterPage" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <link href="Styles/MasterStyleSheet.css" rel="stylesheet" />
    <script type="text/javascript" src="<%= Page.ResolveClientUrl("Scripts/ShoppingCartSideMenuJavaScript.js") %>"></script>

    <title></title>
    <asp:ContentPlaceHolder ID="head" runat="server">
    </asp:ContentPlaceHolder>
</head>
<body>
    <form id="form1" runat="server">

        <div id="ShoppingCartSideMenu">
            Just some text
        </div>

        <div class="wrapper">
            <h1 id="SiteTitle">JEWELRY</h1>
            <p id="UnderSiteTitle">EXCLUSIVE SWISS MADE JEWELRY</p>
            <div id="menu">
                <ul>
                    <li><a href="Home.aspx">HOME</a></li>
                    <li><a href="Shop.aspx">SHOP</a></li>
                    <li><a href="About.aspx">ABOUT</a></li>
                    <li><a href="Terms and Conditions.aspx">Terms & Conditions</a></li>
                    <li><a href="Contact.aspx">CONTACT</a></li>
                    <li id="seperator">|
                    </li>
                    <li>
                        <div>
                            <a id="ShoppingCartBtn" onclick="ShoppingCartBtn_Click" runat="server">
                                <img class="ShoppingCart" src="/Images/Icons/Shopping_cart.png" />
                                <label id="CountCartItems">0</label>
                            </a>
                        </div>
                    </li>
                </ul>
            </div>
            <asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server">
            </asp:ContentPlaceHolder>
        </div>

        <footer>
            <div class="FooterWrapper">
                <div id="FooterDiv1">
                    &copy; 2016 JEWELRY - Created by someone
                </div>
                <div id="FooterDiv2">
                    <a href="#">
                        <img id="FooterFacebook" class="Icons" alt="Facebook" src="/Images/Icons/facebook-logo.png" /></a>
                    <a href="#">
                        <img id="FooterTwitter" class="Icons" alt="Twitter" src="/Images/Icons/twitter-logo.png" /></a>
                    <a href="#">
                        <img id="FooterInstagram" class="Icons" alt="Instagram" src="/Images/Icons/instagram-logo.png" /></a>
                </div>
            </div>
        </footer>
    </form>
</body>
</html>

我在单独的 js 文件中得到了这个 Javascript

var main = function () {
    /* Push menu over by 350px over */
    $('#ShoppingCartBtn').click(function () {
        $('#ShoppingCartSideMenu').animate({
            right: "0px"
        }, 200);
    });

    /* Then push the menu back */
    $('body').click(function () {
        $('#ShoppingCartSideMenu').animate({
            right: "-350px"
        }, 200);
    });
};


$(document).ready(main);

我尝试了这个 post 中建议的所有方法：ASP.Net Master Page and File path issues

但似乎没有任何效果

Answer 1

您应该改用 ResolveUrl 并像这样从根创建 url。

Page.ResolveUrl ("~/Scripts/ShoppingCartSideMenuJavaScript.js")

Update：也就是说你在使用之前没有引用jQuery.js。试试这个。

<script type="text/javascript" src="<%= Page.ResolveUrl("path/to/jquery.js") %>"></script>    
<script type="text/javascript" src="<%= Page.ResolveUrl("~/Scripts/ShoppingCartSideMenuJavaScript.js") %>"></script>

ASP.Net 主页和 Javascript 问题

ASP.Net Master Page and Javascript issue

javascript

asp.net

master-pages