无法从jQuery页面调用其他文件中的.jsp函数

Question

我已经开发了一个java web应用程序来学习如何使用servlet和jsp。

我试图将一些jQuery函数放入一个.js文件中，并将该文件包含在jsp页面中并调用这些函数，但我无法让它工作。

我所处理的文件：

web > js > myFunctions.js
web > WEB-INF > views > _header.jsp
web > WEB-INF > views > homeview.jsp

myFunction.js含量

function hideButtons(userSession) {
    alert("hello");

// HIDE BUTTONS WHEN NO USER IS LOGGED IN
    if (userSession === "") {
        $('#logoutBtn').hide();
        $('#productBtn').hide();
        $('#acctBtn').hide();
    }

// HIDE BUTTONS WHEN USER IS LOGGED IN
    if (userSession !== "") {
        $('#loginBtn').hide();
        $('#loginForm').hide();
    }
}

_header.jsp含量

<%@ page contentType="text/html;charset=UTF-8" language="java" %>

<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
<script type="text/javascript" src="../../js/myFunctions.js"></script>

<div style="background: #E0E0E0; height: 55px; padding: 5px;">
     
    <div style="text-align: center;">

        <div id="homeBtn" style="display: inline; padding-right: 10px;">
            <a href="${pageContext.request.contextPath}/">Home</a>
        </div>
        <div id="productBtn" style="display: inline; padding-right: 10px;">
            <a href="${pageContext.request.contextPath}/productList">Product List</a>
        </div>
        <div id="acctBtn" style="display: inline; padding-right: 10px;">
            <a href="${pageContext.request.contextPath}/userInfo">My Account</a>
        </div>
        <div id="logoutBtn" style="display: inline; padding-right: 10px;">
            <a href="${pageContext.request.contextPath}/logout">Logout</a>
        </div>

    </div>

</div>

<script type="text/javascript">

    $(document).ready(function () {

        hideButtons('${loggedInUser}');

    });

</script>

homeView.jsp含量

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
    <head>
        <title> Home Page </title>
    </head>

    <body>
        <jsp:include page="_header.jsp"></jsp:include>

        <div style="text-align: center">
            <h3> Home Page </h3>
            Welcome to the Home Page of my sample java web application.
        </div>

        <div>
            <b>It includes the following functions:</b>
            <ul>
                <li>Login</li>
                <li>Storing user information in cookies</li>
                <li>Product List</li>
                <li>Create Product</li>
                <li>Edit Product</li>
                <li>Delete Product</li>
            </ul>
        </div>

        <div id="loginForm">
            <hr>
            <jsp:include page="_login.jsp"></jsp:include>
        </div>

        <jsp:include page="_footer.jsp"></jsp:include>
    </body>
</html>

我的想法是，由于_header.jsp将包括在我的所有网页，我将调用一些功能，他们将应用于所有这些网页。

如果我将jQuery从myFunctions.js中取出并直接放入_header.jsp中，一切都会像我计划的那样工作。但出于某种原因，我无法调用外部.js文件中的函数。

我做错了什么或错过了什么吗？

更新

结果，我在.js资源的路径上遇到了问题。我是给你的

<script type="text/javascript" src="/../../js/myFunctions.js"></script>

_header.jsp页面位于WEB-INF -> views中，而我的js文件夹位于WEB-INF之外，所以我认为，告诉上两个目录，它就能找到它。

猜了又说

<script type="text/javascript" src="/myApp/js/myFunctions.js"></script>

它找到路径并正确加载资源。但我仍然不知道为什么我的第一种方式是不正确的，没有工作。我以前在申请时也见过这样的情况。

有什么我遗漏的地图吗？就像声明js文件夹在web.xml中的路径一样

Answer 1

答案是，因为在IntelliJ的Tomcat配置中，我给我的应用程序部署提供了一个/myApp的上下文路径，这让我很困惑。

删除之后，我可以说是/../../js/myFunctions.js，它找到了正确的文件。