Question

我正在整理Angular应用程序，我正在尝试以下列方式使用引导程序导航栏：

<div class="navbar" >
        <div class="navbar-inner">
            <div class="container">
                <!--<a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">-->
                    <a class="btn btn-navbar">
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                    </a>
                <div class="nav-collapse" >
                        <ul class="nav">
                            <li class="dropdown">
                                <a href="#" class="dropdown-toggle" data-toggle="dropdown">Customer Instances <b class="caret"></b></a>
                                <ul class="dropdown-menu">
                                    <li><a href="#/itarList">iTAR</a></li>
                                    <li class="divider"></li>
                                    <li><a href="#/nonItarList">Non-iTAR</a></li>
                                </ul>
                            </li>
                            <li class="dropdown">
                                <a href="#" class="dropdown-toggle" data-toggle="dropdown">Training & Documentation <b class="caret"></b></a>
                                <ul class="dropdown-menu">
                                    <li><a href="#/videoTutorials">Video Tutorials</a></li>
                                    <li><a href="#/taskBasedHelp">Task-Based Help</a></li>
                                    <li class="divider"></li>
                                    <li><a href="#/documentTemplates">Document Templates</a></li>
                                    <li><a href="#/artifactSamples">Artifact Samples</a></li>
                                </ul>
                            </li>
                            <li class="dropdown">
                                <a href="#" class="dropdown-toggle" data-toggle="dropdown">Service Requests <b class="caret"></b></a>
                                <ul class="dropdown-menu">
                                    <li><a href="#/viewExistingRequests">View Existing Requests</a></li>
                                    <li class="divider"></li>
                                    <li><a href="#/enterNewRequest">Enter New Request</a></li>
                                </ul>
                            </li>
                            <li class="dropdown">
                                <a href="#" class="dropdown-toggle" data-toggle="dropdown">Development Tracker <b class="caret"></b></a>
                                <ul class="dropdown-menu">
                                    <li><a href="#/viewBacklogItems">View Backlog Items</a></li>
                                    <li><a href="#/viewFeatureReleaseSchedule">View Feature Release Schedule</a></li>
                                    <li class="divider"></li>
                                    <li><a href="#/viewListOfSuggestedEnhancements">View List Of Suggested Enhancements</a></li>
                                    <li><a href="#/suggetAnEnhancement">Suggest An Enhancement</a></li>
                                    <li class="divider"></li>
                                    <li><a href="#/viewActiveBugReports">View Active Bug Reports</a></li>
                                    <li><a href="#/reportABug">Report A Bug</a></li>
                                </ul>
                            </li>
                        </ul>
                    <ul class="nav pull-right">
                        <li class="divider-vertical"></li>
                        <li class="dropdown">
                            <a href="#" class="dropdown-toggle" data-toggle="dropdown">Site Administration <b class="caret"></b></a>
                            <ul class="dropdown-menu">
                                <li><a href="#/userAdministration">User Administration</a></li>
                                <li class="divider"></li>
                                <li><a href="#/instanceAdministration">Instance Administration</a></li>
                                <li class="divider"></li>
                                <li><a href="#/applicationAdministration">Application Administration</a></li>
                            </ul>
                        </li>
                    </ul>
                </div>
            </div>
        </div>
    </div>

目前，存在一种不良行为：当点击顶级导航项（例如“客户实例”或“培训和文档”）时，页面网址会立即重置为“主页” ，甚至在进行任何导航选择之前。我要求就如何防止这种行为提出建议。

Answer 1

您必须删除所有href="#"部分。根据{{3}}，您可以为这些元素添加样式：

.nav, .pagination, .carousel, .panel-title a { cursor: pointer; }

如何防止顶级引导程序导航栏项目更改URL

1 个答案: