Jquery Twitter引导下拉菜单在部署时不起作用
我的应用程序在开发过程中工作得很好,但当我在tomcat下拉菜单上部署它时,它就停止工作了。它就在那里,它落在鼠标上方,但它不会对鼠标点击做出反应。我已经检查了生成的链接,看起来不错。如果我手动输入URL,它可以正常工作。我猜这是JavaScript/文件位置问题,但我似乎找不到它。可能遗漏了一些明显的东西 这是我生成菜单的main.gsp:Jquery Twitter引导下拉菜单在部署时不起作用,jquery,grails,twitter-bootstrap,Jquery,Grails,Twitter Bootstrap,我的应用程序在开发过程中工作得很好,但当我在tomcat下拉菜单上部署它时,它就停止工作了。它就在那里,它落在鼠标上方,但它不会对鼠标点击做出反应。我已经检查了生成的链接,看起来不错。如果我手动输入URL,它可以正常工作。我猜这是JavaScript/文件位置问题,但我似乎找不到它。可能遗漏了一些明显的东西 这是我生成菜单的main.gsp: <!doctype html> <head> <meta http-equiv="Content-Type" co
<!doctype html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title><g:layoutTitle default="Grails"/></title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="shortcut icon" href="${resource(dir: 'images', file: 'favicon.ico')}" type="image/x-icon">
<link rel="apple-touch-icon" href="${resource(dir: 'images', file: 'apple-touch-icon.png')}">
<link rel="apple-touch-icon" sizes="114x114" href="${resource(dir: 'images', file: 'apple-touch-icon-retina.png')}">
<link rel="stylesheet" href="${resource(dir: 'css', file: 'main.css')}" type="text/css">
<link rel="stylesheet" href="${resource(dir: 'css', file: 'mobile.css')}" type="text/css">
<link rel="stylesheet" href="${resource(dir: 'css/bootstrap', file: 'bootstrap.css')}" type="text/css">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript" src="<g:resource dir="/js/bootstrap" file="bootstrap-dropdown.js" />"></script>
<g:layoutHead/>
<r:layoutResources />
</head>
<body>
<div class="navbar-inner">
<a href="http://grails.org">
<img src="${resource(dir: 'images', file: 'coming.gif')}" alt="Grails"/>
</a>
<sec:ifLoggedIn>
<div id="headinfo">
<g:message code="header.user" /> : ${ sec.loggedInUserInfo(field:'username') } <br/>
<g:message code="header.date" /> : <g:formatDate date='${new Date()}' format='E, dd MMM yyyy' locale='${Locale.ENGLISH}'/> <br/>
<a href="?lang=sr"> <g:img dir="images" file="sr.gif"/> </a>
<a href="?lang=en"> <g:img dir="images" file="en.gif"/> </a>
</div>
</sec:ifLoggedIn>
<h2 id="maintitle"><g:layoutTitle default="Grails"/></h2>
</div>
<header class="jumbotron subhead" id="overview">
<div class="subnav">
<ul class="nav nav-pills" id="meni">
<li class="dropdown open">
<a href="${createLink(controller:'ticket',action:'index')}"> <g:message code="menu.home" /> </a>
</li>
<li class="dropdown open">
<g:link controller="ticket" action="list" data-toggle="dropdown"> <g:message code="menu.tickets" /> <b class="caret"></b> </g:link>
<ul class="dropdown-menu">
<li> <g:link controller="ticket" action="list" data-toggle="dropdown"> <g:message code="menu.ticketList" /> </g:link> </li>
<li> <g:link controller="ticket" action="create" data-toggle="dropdown"> <g:message code="menu.createTicket" /> </g:link> </li>
</ul>
</li>
<li class="dropdown open">
<a href="#" data-toggle="dropdown"> <g:message code="menu.admin" /> <b class="caret"></b> </a>
<ul class="dropdown-menu">
<li> <g:link controller="user" action="list" data-toggle="dropdown"> <g:message code="menu.listUsers" /> </g:link> </li>
<li> <g:link controller="company" action="list" data-toggle="dropdown"> <g:message code="menu.listCompanies" /> </g:link> </li>
<li> <g:link controller="company" action="create" data-toggle="dropdown"> <g:message code="menu.createCompany" /> </g:link> </li>
<li> <g:link controller="project" action="list" data-toggle="dropdown"> <g:message code="menu.projectsList" /> </g:link> </li>
<li> <g:link controller="project" action="create" data-toggle="dropdown"> <g:message code="menu.createProjects" /> </g:link> </li>
<li> <g:link controller="user" action="invitation" data-toggle="dropdown"> <g:message code="menu.inviteUser" /> </g:link> </li>
</ul>
</li>
<sec:ifNotLoggedIn>
<li class="dropdown open">
<g:link controller="login" action="index" data-toggle="dropdown"> <g:message code="menu.login" /> </g:link>
</li>
</sec:ifNotLoggedIn>
<sec:ifLoggedIn>
<li class="dropdown open">
<g:link controller="logout" action="index" data-toggle="dropdown"> <g:message code="menu.logout" /> </g:link>
</li>
</sec:ifLoggedIn>
</ul>
</div>
</header>
<div id="maincontent">
<g:layoutBody/>
</div>
<div class="navbar-inner" id="footerdiv">
<div id="foottext"> Help Desk </div>
</div>
<div id="spinner" class="spinner" style="display:none;"><g:message code="spinner.alt" default="Loading…"/></div>
<g:javascript library="application"/>
<r:layoutResources />
</div>
</body>
我注意到,如果我用鼠标右键打开一个下拉菜单链接,在“新建”选项卡中打开,它就会工作。你需要有有效的Doctype。确保.gsp和生成的页面源以以下内容开头:
<!doctype html>
<html lang="en" xmlns="http://www.w3.org/1999/html">
更改
<script type="text/javascript" src="<g:resource dir="/js/bootstrap" file="bootstrap-dropdown.js" />"></script>
到
您可能需要使用。这将处理所有必要的引导文件的包含。我是MVC和引导的新手,在bootstrap 3.3.5下我修改了bootstrap.css以恢复子菜单类,但没有修改bootstrap.min.css时出现了这个问题。在Dev中,编译Debug=True(web.config-->system.web)和缩小的文件被忽略,但在部署到Debug=False的服务器时,缩小的版本(bootstrap.min.css)覆盖了我的自定义版本。作为短期修复,我在生产中删除了bootstrap.min.css文件,但现在将研究更新minified.css文件。肯定是新手犯的错误,但我们中有一些人在那里,我希望这对其他人有所帮助。您使用的是什么浏览器?这取决于javascript控制台可能是一个好的开始位置。@PraveenKumar抱歉。粘贴时出错。@Jonasstensed大部分是Chrome。请查看,看看是否有任何报告的错误,以及是否加载了文件。我刚刚注意到,如果我用鼠标右键打开菜单链接,菜单就会工作。\u单击/u在“新建”选项卡中打开
<!doctype html>
<html lang="en" xmlns="http://www.w3.org/1999/html">
<script type="text/javascript" src="<g:resource dir="/js/bootstrap" file="bootstrap-dropdown.js" />"></script>
<script type="text/javascript" src="<g:resource dir="js/bootstrap" file="bootstrap-dropdown.js" />"></script>