我正在创建多个网页。我有一个导航栏,里面有一个下拉列表。我将此导航栏复制粘贴到每个JSP网页上,但下拉菜单在其中两个网页上不起作用。
这些网页有一个共同点——它们都有一个日期选择器组件,而我的其他网页都没有。所以我怀疑datepicker和下拉菜单之间存在冲突。
编辑:
我对日期选择器的部分进行了注释,结果发现它实际上并不是因为日期选择器。
我不熟悉JavaScript,有人能帮我找出问题所在吗?
registration.jsp
(下拉菜单在此页面上不起作用)
<%@ page language="java" contentType="text/html; charset=ISO-8859-1" pageEncoding="ISO-8859-1"%>
<%@ page isELIgnored="false" %>
<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="sec" uri="http://www.springframework.org/security/tags"%>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>User Registration Form</title>
<link href="<c:url value='/static/css/bootstrap.css' />" rel="stylesheet">
</link>
<link href="<c:url value='/static/css/app.css' />" rel="stylesheet"></link>
</head>
<body>
<nav class="navbar" style="padding:5px 8%;">
<ul class="nav navbar-nav">
<li><a href="<c:url value='/home'/>">Home</a></li>
</ul>
<ul class="nav navbar-nav navbar-right">
<li><a href=" <c:url value='/list'/>">Users</a></li>
<li><a href=" <c:url value='/services'/>">Services</a></li>
<li><a href=" <c:url value='/clients'/>">Clients</a></li>
<li><a href=" <c:url value='/contact'/>">Contact</a></li>
<li><a href=" <c:url value='/news'/>">News</a></li>
<li class="dropdown">
<a class="dropdown-toggle" data-toggle="dropdown" href="#">
Session Details <span class="caret"></span>
</a>
<ul class="dropdown-menu">
<li><a>SSO ID: ${loggedinuser}</a></li>
<li><a href=" <c:url value='/list'/>">My Profile</a></li>
<li><a href="#">Change Login Info</a></li>
<li><a href="<c:url value='logout'/>">Log Out</a></li>
</ul>
</li>
</ul>
</nav>
<div style="margin-top: 60px;"></div>
[Some input fields ...]
<div class="container">
<h4>Hire Date:</h4>
<div class="input-group">
<div class="input-group-addon">
<i class="fa fa-calendar"> </i>
</div>
<form:input type="text" path="hireDate" id="hireDate"
class="form-control" placeholder="Hire Date" />
</div>
<div class="has-error">
<form:errors path="hireDate" class="help-inline" />
</div>
</div>
[some more input fields ...]
<div class="form-actions floatRight">
<c:choose>
<c:when test="${edit}">
<input type="submit" value="Update" class="btn btn-primary" /> or <a
href="<c:url value='/list' />">Cancel</a>
</c:when>
<c:otherwise>
<input type="submit" value="Register" class="btn btn-primary" /> or <a
href="<c:url value='/list' />">Cancel</a>
</c:otherwise>
</c:choose>
</div>
</form:form>
<!-- Extra JavaScript/CSS added manually in "Settings" tab -->
<!-- Include jQuery -->
<script type="text/javascript"
src="https://code.jquery.com/jquery-1.11.3.min.js"></script>
<script type="text/javascript"
src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.4.1/js/bootstrap-datepicker.min.js"></script>
<!-- Include Date Range Picker -->
<script>
$(document).ready(
function() {
var date_input = $('input[name="date"]'); //our date input has the name "date"
var container = $('.bootstrap-iso form').length > 0 ? $(
'.bootstrap-iso form').parent() : "body";
date_input.datepicker({
format : 'mm/dd/yyyy',
container : container,
todayHighlight : true,
autoclose : true,
})
})
</script>
clients.jsp
(下拉列表在此页面上有效)
<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
pageEncoding="ISO-8859-1"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="sec" uri="http://www.springframework.org/security/tags"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Our Clients</title>
<link href="<c:url value='/static/css/bootstrap.css' />" rel="stylesheet"></link>
<link href="<c:url value='/static/css/app.css' />" rel="stylesheet"></link>
<script
src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script
src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
</head>
<body>
<nav class="navbar" style="padding:5px 8%;">
<ul class="nav navbar-nav">
<li><a href="<c:url value='/home'/>">Home</a></li>
</ul>
<ul class="nav navbar-nav navbar-right">
<li><a href=" <c:url value='/list'/>">Users</a></li>
<li><a href=" <c:url value='/services'/>">Services</a></li>
<li><a href=" <c:url value='/clients'/>">Clients</a></li>
<li><a href=" <c:url value='/contact'/>">Contact</a></li>
<li><a href=" <c:url value='/news'/>">News</a></li>
<li class="dropdown">
<a class="dropdown-toggle" data-toggle="dropdown" href="#">
Session Details <span class="caret"></span>
</a>
<ul class="dropdown-menu">
<li><a>SSO ID: ${loggedinuser}</a></li>
<li><a href=" <c:url value='/list'/>">My Profile</a></li>
<li><a href="#">Change Login Info</a></li>
<li><a href="<c:url value='logout'/>">Log Out</a></li>
</ul>
</li>
</ul>
</nav>
<div style="margin-top: 60px;"></div>
<div style="margin: 5px 100px;">
<div class="container text-center" style="padding: 0px 20%">
<h2 style="font-size: 70px; color: #6ea6ca">CLIENTS</h2>
<div
style="height: 5px; width: 30%; background-color: #6ea6ca; margin: 0 auto;">
</div>
<br>
<p>We have provided solutions for all types of companies-private
and public.</p>
<br>
<p>Here are a few of our clients:</p>
</div>
[Various text and images...]
</div>
</body>
</html>
