Javascript 如果它是从我项目中的 jsp 链接的则不起作用

Question

如果我从 jsp 链接它，我的 js 在我的动态 Web 项目中不起作用，但如果我将它放在 jsp 中，它工作正常。每个js代码都一样。我不知道该怎么办，jquery 被导入... javascript 代码是正确的，因为它在同一个 jsp 中工作正常，但如果我将它放在 *.js 文件中，它就不起作用。这是我的代码：

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
    <!DOCTYPE html>
<html lang="it">
<head>
    <meta charset="UTF-8">
    <title>CheckUp - Homepage</title>
    <link rel="stylesheet" href="css/SharedCSS/Header.css" type="text/css"/>
    <link rel="stylesheet" href="css/SharedCSS/Footer.css" type="text/css"/>
    <link rel="stylesheet" href="css/HomepageCSS/CarouselSlider.css" type="text/css"/>
    <link rel="stylesheet" href="css/HomepageCSS/HomepageIcon.css" type="text/css"/>
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.5.3/dist/css/bootstrap.min.css" integrity="sha384-TX8t27EcRE3e/ihU7zmQxVncDAy5uIKz4rEkgIXeMed4M0jlfIDPvg6uqKI2xXr2" crossorigin="anonymous">
</head>
<body>
    <!-- INCLUSIONE HEADER -->
    <%@include file="Shared/Header.jsp"%> 
    
    <!-- INCLUSIONE SLIDER -->
    <%@include file="Homepage/CarouselSlider.jsp"%>

    <!-- INCLUSIONE ICONE -->
    <%@include file="Homepage/HomepageIcon.html"%>
    
    <!-- INCLUSIONE FOOTER-->
    <%@include file="Shared/Footer.jsp"%> 
    
    
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="../js/HomepageJS/CarouselSlider.js" type="text/Javascript"></script>
    

</body>
</html>

此处“CarouselSlider.js”：

var slideIndex = 1;
showDivs(slideIndex);
carousel();

function plusDivs(n) {
    showDivs(slideIndex += n);
}

function showDivs(n) {
    var i;
    var x = document.getElementsByClassName("mySlides");
    if (n > x.length) { slideIndex = 1 }
    if (n < 1) { slideIndex = x.length };
    for (i = 0; i < x.length; i++) {
        x[i].style.display = "none";
    }
    x[slideIndex - 1].style.display = "block";
}

function carousel() {
    var i;
    var x = document.getElementsByClassName("mySlides");
    for (i = 0; i < x.length; i++) {
        x[i].style.display = "none";
    }
    slideIndex++;
    if (slideIndex > x.length) { slideIndex = 1 }
    x[slideIndex - 1].style.display = "block";

    setTimeout(carousel, 5000);
}

和“CarouselSlider.jsp”：

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
    
<div class="w3-content w3-display-container">
    <img class="mySlides" src="Img/TAMPONE-CORONAVIRUS-COVID.jpg">
    <img class="mySlides" src="Img/test-udito.jpg">
    <img class="mySlides" src="Img/Prenota.jpg">
    <div class="w3-center w3-display-bottommiddle">
        <div class="w3-left" onclick="plusDivs(-1)">&#10094;</div>
        <div class="w3-right" onclick="plusDivs(1)">&#10095;</div>
        <span class="w3-badge demo w3-border" onclick="currentDiv(1)"></span>
        <span class="w3-badge demo w3-border" onclick="currentDiv(2)"></span>
        <span class="w3-badge demo w3-border" onclick="currentDiv(3)"></span>
    </div>
</div>

更新：我解决了。这是一个路径问题。我用“../”代替“./”

Answer 1

检查您的控制台并确认文件确实正在加载。很可能你的路径不好。

你的type属性也不好。在 HTML5 中，它也是多余的，只需将其删除即可。

<script src="../correct/path/to/js/file.js"></script>

Answer 2

只需添加

<script src="../js/HomepageJS/CarouselSlider.js"></script>

此外，如果你能显示你的.jsp和.js文件的路径结构，那就更清楚了。

Answer 3

尝试添加

这对你有帮助：

<script src="../js/HomepageJS/CarouselSlider.js"></script>

Javascript 如果它是从我项目中的 jsp 链接的则不起作用

Javascript doesn't work if it's linked from jsp in my project

javascript

java

jquery

jsp