网站发布后，Bootstrap 3 导航栏无法正常工作答案

【问题标题】：Bootstrap3 nav bar not working once site is published网站发布后，Bootstrap 3 导航栏无法正常工作
【发布时间】：2014-04-10 00:27:48
【问题描述】：

我开发了一个网站，当我在 Visual Studio 2012 中对其进行调试时，一切正常。但发布后，我的导航下拉菜单不起作用。看起来它只是在当前 url 的末尾放了一个 # 。我正在使用主/内容页面设置，据我所知，它看起来像一个 jquery 问题。不知道如何解决这个问题。任何帮助将不胜感激。

这些在母版页标题中：

<link href="../Content/bootstrap.css" rel="stylesheet" />
<link href="../Content/external-theme.css" rel="stylesheet" />

母版页正文：

<body>
<form id="form1" runat="server">
    <div>
        <div class="container">
            <nav class="navbar navbar-default" id="navbar" role="navigation">

                <!-- Brand and toggle get grouped for better mobile display -->
                <div class="navbar-header">
                    <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#navbar-collapse-1">
                        <span class="sr-only">Toggle navigation</span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                    </button>
                    <a class="navbar-brand" href="Home.aspx">
                        <img src="Images/XXXX.png" class="img-responsive" alt="logo" />
                    </a>
                </div>

                <!-- Collect the nav links, forms, and other content for toggling -->
                <div class="collapse navbar-collapse" id="navbar-collapse-1">
                    <ul class="nav navbar-nav">
                        <li><a href="Home.aspx">Home</a></li>
                        <li class="dropdown">
                            <a href="#" class="dropdown-toggle" data-toggle="dropdown">Products & Services <b class="caret"></b></a>
                            <ul class="dropdown-menu">
                                <li><a href="Consulting.aspx">Consulting</a></li>
                                <li><a href="SpaceFiller.aspx">Space Filler</a></li>
                                <li><a href="Documentation.aspx">Product Documentation</a></li>
                            </ul>
                        </li>
                        <li class="dropdown">
                            <a href="#" class="dropdown-toggle" data-toggle="dropdown">Careers <b class="caret"></b></a>
                            <ul class="dropdown-menu">
                                <li><a href="Company.aspx">Company</a></li>
                                <li><a href="Openings.aspx">Openings</a></li>
                            </ul>
                        </li>
                        <%--<li><a href="Customer.aspx">Customer Portal</a></li>--%>
                        <li><a href="Contact.aspx">Contact Us</a></li>
                    </ul>
                </div>
                <!-- /.navbar-collapse -->
                <!-- /.container-fluid -->
            </nav>
        </div>
        <asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server">
        </asp:ContentPlaceHolder>
    </div>
</form>
<script src="/Scripts/jquery-2.1.0.js"></script>
<script src="/Scripts/bootstrap.min.js"></script>
<script type="text/javascript">
    $(document).ready(function () {
        $('#sidebar').affix({
            offset: {
                top: 290
            }
        });

        var $body = $(document.body);
        var navHeight = $('.navbar').outerHeight(true) + 10;

        $body.scrollspy({
            target: '#leftCol',
            offset: navHeight
        });
    });
</script>

【问题讨论】：

控制台有错误吗？
不，没有错误。我唯一能说的是，jquery 功能根本没有工作。轮播、affix.js、导航栏下拉菜单等

标签： jquery html asp.net css

【解决方案1】：

所有需要做的就是在母版页底部的两个 jquery 脚本引用上删除“Scripts/...”开头的正斜杠。问题解决了。

<script src="Scripts/jquery-2.1.0.js"></script>
<script src="Scripts/bootstrap.min.js"></script>

【讨论】：