我有一个 spring mvc 应用程序，在我的主页中，我需要使用一个 javascript 文件。我尝试以这种方式包含文件:
<script type="text/javascript" src="js/index.js"></script>
但是当我运行应用程序时，系统行为似乎没有脚本在运行。也试试这个:
<script type="text/javascript" src="<c:url value='js/index.js'/>"></script>
但结果是一样的。有人知道为什么会这样吗？
ps.: 我页面的全部代码是:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>HorarioLivre</title>
<script src="http://code.jquery.com/jquery-2.1.0.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.10.4/jquery-ui.min.js"></script>
<script type="text/javascript" src="js/index.js"></script>
<link rel="stylesheet" href="css/style-main.css">
<link rel="stylesheet" href="css/style-popup.css">
</head>
<body>
<header>
<div class="container">
<h1><a href="#">HorarioLivre</a></h1>
<nav>
<ul>
<li><a href="listagem_evento.html" class="icon evento">Eventos</a></li>
<li><a href="cadastra_horario.html" class="icon horario">Cadastrar Horarios</a></li>
<li><a href="listagem_horario.html" class="icon horario">Listar Horarios</a></li>
<li><a href="listagem_usuario.html" class="icon usuario">Usuarios</a></li>
<li><a href="#">${usuario.nome}</a>
<ul>
<li><a href="usuario_perfil.html" class="icon perfil">Perfil</a></li>
<li><a href="usuario_config.html" class="icon settings">Configurações</a></li>
<li><a href="usuario_logoff.html" class="icon logout">Sair</a></li>
</ul>
</li>
</ul>
</nav>
</div>
</header>
<div id="results">
<a href="#" id="close">Fechar</a>
<div id="content"></div>
</div>
</body>
</html>
脚本应该在弹出窗口中打开我的子页面，但它们是在浏览器窗口中打开的。
** 更新 1 **
我的 index.js 是:
$(document).ready(function(){
setupPopup();
});
function setupPopup() {
$('a').click(function() {
$('#content').load($(this).attr('href'));
$('#container').append('<div id="cover">');
$('#results').fadeIn(500);
popupPosition();
});
$('#close').click(function() {
$('#results').fadeOut(100);
$('#cover').remove();
});
$(window).bind('resize', popupPosition);
}
function popupPosition() {
if(!$("#results").is(':visible')){ return; }
$("#results").css({
left: ($(window).width() - $('#results').width()) / 2,
top: ($(window).width() - $('#results').width()) / 7,
position:'absolute'
});
$('#results').draggable();
}
最佳答案
but when I running the application, the system behavior seems like no script is running.
这是因为浏览器无法从指定位置加载 javascript 'index.js'。如果您打开浏览器控制台并转到“网络”选项卡，您将看到 404(找不到资源)。您不能以这种方式指定 JSP 文件中 JavaScript 的相对 URL。
您需要提供您的文件夹结构(index.js 在您的项目中的位置)以及您如何配置 web.xml。但是，如果您尝试以下操作，它肯定会起作用:
<script type="text/javascript" src="${pageContext.request.contextPath}/js/index.js"></script>
然后将包含“index.js”的“js”文件夹与“WEB-INF”保持在同一级别。
关于javascript - 如何在 JSP 页面中包含外部 JS 文件，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/22107788/