繁体   English   中英

CSS 和 JS 未加载到 JSP servlet 映射上

[英]CSS and JS not loading on JSP servlet mapping

当我没有将 servlet 附加到 servlet 映射中的/

<servlet-mapping>
    <servlet-name>ControllerServlet</servlet-name>
    <url-pattern>/</url-pattern>
</servlet-mapping>

我所有的 css 和 javascript 框架都在加载。 但是,当我在 web.xml 中添加这部分代码时,没有加载 css 和 javascript。 我如何确保 servlet 知道它是一个 css/js 文件而不是一个方法?

网页.xml

<context-param>
        <param-name>jdbcURL</param-name>
        <param-value>jdbc:mysql://localhost:3306/bookstore</param-value>
    </context-param>

    <context-param>
        <param-name>jdbcUsername</param-name>
        <param-value>root</param-value>
    </context-param>

    <context-param>
        <param-name>jdbcPassword</param-name>
        <param-value>12345</param-value>
    </context-param>

    <servlet>
        <servlet-name>ControllerServlet</servlet-name>
        <servlet-class>net.codejava.javaee.bookstore.ControllerServlet</servlet-class>
    </servlet>

    <servlet-mapping>
        <servlet-name>ControllerServlet</servlet-name>
        <url-pattern>/</url-pattern>
    </servlet-mapping>

    <error-page>
        <exception-type>java.lang.Exception</exception-type>
        <location>/Error.jsp</location>
    </error-page>
</web-app>

控制器小服务程序

public class ControllerServlet extends HttpServlet {
    private static final long serialVersionUID = 1L;
    private BookDAO bookDAO;

    public void init() {
        String jdbcURL = getServletContext().getInitParameter("jdbcURL");
        String jdbcUsername = getServletContext().getInitParameter("jdbcUsername");
        String jdbcPassword = getServletContext().getInitParameter("jdbcPassword");

        bookDAO = new BookDAO(jdbcURL, jdbcUsername, jdbcPassword);

    }

    protected void doPost(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException {
        doGet(request, response);
    }

    protected void doGet(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException {
        String action = request.getServletPath();

        try {
            switch (action) {
            case "/new":
                //showNewForm(request, response);
                break;
            case "/insert":
                //insertBook(request, response);
                break;
            case "/delete":
                //deleteBook(request, response);
                break;
            case "/edit":
                //showEditForm(request, response);
                break;
            case "/update":
                //updateBook(request, response);
                break;
            default:
                listBook(request, response);
                break;
            }
        } catch (SQLException ex) {
            throw new ServletException(ex);
        }
    }

    private void listBook(HttpServletRequest request, HttpServletResponse response)
            throws SQLException, IOException, ServletException {
        List<Book> listBook = bookDAO.listAllBooks();
        request.setAttribute("listBook", listBook);
        RequestDispatcher dispatcher = request.getRequestDispatcher("BookList.jsp");
        dispatcher.forward(request, response);
    }
}

jsp页面

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
    <head>

        <!-- JS -->     
        <script src='static/js/bootstrap.min.js'></script>
        <script src='static/js/vue.min.js'></script>

        <!-- CSS -->
        <link rel="stylesheet" type="text/css" href="static/css/bootstrap.min.css">
        <link rel="stylesheet" type="text/css" href="static/css/common.css">
     </head>
<body>
    <center>
        <h1>Books Management</h1>
        <h2>
            <a href="new">Add New Book</a>
            &nbsp;&nbsp;&nbsp;
            <a href="list">List All Books</a>

        </h2>
    </center>
    <div align="center">
        <table border="1" cellpadding="5">
            <caption><h2>List of Books</h2></caption>
            <tr>
                <th>ID</th>
                <th>Title</th>
                <th>Author</th>
                <th>Price</th>
                <th>Actions</th>
            </tr>
            <c:forEach var="book" items="${listBook}">
                <tr>
                    <td><c:out value="${book.id}" /></td>
                    <td><c:out value="${book.title}" /></td>
                    <td><c:out value="${book.author}" /></td>
                    <td><c:out value="${book.price}" /></td>
                    <td>
                        <a href="edit?id=<c:out value='${book.id}' />">Edit</a>
                        &nbsp;&nbsp;&nbsp;&nbsp;
                        <a href="delete?id=<c:out value='${book.id}' />">Delete</a>                     
                    </td>
                </tr>
            </c:forEach>
        </table>
    </div>  
</body>
</html>

您可以添加如下所示的 CSS 文件

<LINK REL="StyleSheet" HREF="<%=request.getContextPath()%>/CSS/style.css" TYPE="text/css">

所以文件夹结构如下

在此处输入图片说明

您需要在WebContent添加 css/js 文件

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM