请老师帮忙看看为什么我的jsp不显示body中的内容

请老师帮忙看看为什么我的jsp不显示body中的内容

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns="http://xmlns.jcp.org/xml/ns/javaee"
         xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
         xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee http://xmlns.jcp.org/xml/ns/javaee/web-app_3_1.xsd"
         version="3.1">
    <filter>
        <filter-name>CharsetEncoding</filter-name>
        <filter-class>com.imooc.cart.filter.CharsetEncodingFilter</filter-class>
        <init-param>
            <param-name>encoding</param-name>
            <param-value>UTF-8</param-value>
        </init-param>
    </filter>
 
    <filter-mapping>
        <filter-name>CharsetEncoding</filter-name>
        <url-pattern>*.do</url-pattern>
    </filter-mapping>
 
    <welcome-file-list>
        <welcome-file>/index.jsp</welcome-file>
    </welcome-file-list>
</web-app>
<%--
  Created by IntelliJ IDEA.
  User: Mr.Yao
  Date: 2019-04-17
  Time: 17:35
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
  <head>
    <title>CartDemo</title>
    <!--
      实现一进入到首页就进行跳转
      refresh表示自由刷新
    -->
    <meta http-equiv="refresh" content="0;url=<%= request.getContextPath()%>/product/list.do">
  </head>
</html>
 
package com.imooc.cart.filter;
 
 
import javax.servlet.*;
import java.io.IOException;
 
/**
 * 字符编码过滤器
 */
public class CharsetEncodingFilter implements Filter {
    private String encoding;
    @Override
    public void init(FilterConfig filterConfig) throws ServletException {
        //从过滤器初始化获得编码格式
        this.encoding = filterConfig.getInitParameter("encoding");
    }
 
    @Override
    public void destroy() {
 
    }
 
    @Override
    public void doFilter(ServletRequest servletRequest, ServletResponse servletResponse, FilterChain filterChain) throws IOException, ServletException {
        servletRequest.setCharacterEncoding(encoding);
        filterChain.doFilter(servletRequest, servletResponse);
    }
}
 
package com.imooc.cart.data;
 
/**
 * 商品(课程)
 */
public class Product {
    //课程编号
    private Long id;
    //课程标签
    private String tag;
    //课程名称
    private String name;
    //课程描述
    private String desc;
    //课程级别
    private String level;
    //课程价格  精确到:元
    private int price;
 
    public Product(Long id, String tag, String name, String desc, String level, int price) {
        this.id = id;
        this.tag = tag;
        this.name = name;
        this.desc = desc;
        this.level = level;
        this.price = price;
    }
 
    public Long getId() {
        return id;
    }
 
    public void setId(Long id) {
        this.id = id;
    }
 
    public String getTag() {
        return tag;
    }
 
    public void setTag(String tag) {
        this.tag = tag;
    }
 
    public String getName() {
        return name;
    }
 
    public void setName(String name) {
        this.name = name;
    }
 
    public String getDesc() {
        return desc;
    }
 
    public void setDesc(String desc) {
        this.desc = desc;
    }
 
    public String getLevel() {
        return level;
    }
 
    public void setLevel(String level) {
        this.level = level;
    }
 
    public int getPrice() {
        return price;
    }
 
    public void setPrice(int price) {
        this.price = price;
    }
}
 
package com.imooc.cart.data;
 
import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;
import java.util.Map;
 
/**
 * 本地缓存
 */
public class LocalCache {
    //创建Map,属性名是商品id,值是对应的商品
    private static Map<Long,Product> map = new HashMap<>();
    //采用静态代码块方式初始化商品
    static {
        map.put(1l, new Product(1l, "HTML/CSS""HTML+CSS基础课程""HTML+CSS基础教程8小时带领大家步步深入学习标签用法和意义""初级"219));
        map.put(2l, new Product(2l, "HTML/CSS""HTML+CSS基础课程""HTML+CSS基础教程8小时带领大家步步深入学习标签用法和意义""初级"219));
        map.put(3l, new Product(3l, "HTML/CSS""HTML+CSS基础课程""HTML+CSS基础教程8小时带领大家步步深入学习标签用法和意义""初级"219));
        map.put(4l, new Product(4l, "HTML/CSS""HTML+CSS基础课程""HTML+CSS基础教程8小时带领大家步步深入学习标签用法和意义""初级"219));
        map.put(5l, new Product(5l, "HTML/CSS""HTML+CSS基础课程""HTML+CSS基础教程8小时带领大家步步深入学习标签用法和意义""初级"219));
        map.put(6l, new Product(6l, "HTML/CSS""HTML+CSS基础课程""HTML+CSS基础教程8小时带领大家步步深入学习标签用法和意义""初级"219));
        map.put(7l, new Product(7l, "HTML/CSS""HTML+CSS基础课程""HTML+CSS基础教程8小时带领大家步步深入学习标签用法和意义""初级"219));map.put(1l, new Product(1l, "HTML/CSS""HTML+CSS基础课程""HTML+CSS基础教程8小时带领大家步步深入学习标签用法和意义""初级"219));
        map.put(8l, new Product(8l, "HTML/CSS""HTML+CSS基础课程""HTML+CSS基础教程8小时带领大家步步深入学习标签用法和意义""初级"219));
        map.put(9l, new Product(9l, "HTML/CSS""HTML+CSS基础课程""HTML+CSS基础教程8小时带领大家步步深入学习标签用法和意义""初级"219));
        map.put(10l, new Product(10l, "HTML/CSS""HTML+CSS基础课程""HTML+CSS基础教程8小时带领大家步步深入学习标签用法和意义""初级"219));
        map.put(11l, new Product(11l, "HTML/CSS""HTML+CSS基础课程""HTML+CSS基础教程8小时带领大家步步深入学习标签用法和意义""初级"219));
        map.put(12l, new Product(12l, "HTML/CSS""HTML+CSS基础课程""HTML+CSS基础教程8小时带领大家步步深入学习标签用法和意义""初级"219));
        map.put(13l, new Product(13l, "HTML/CSS""HTML+CSS基础课程""HTML+CSS基础教程8小时带领大家步步深入学习标签用法和意义""初级"219));
        map.put(14l, new Product(14l, "HTML/CSS""HTML+CSS基础课程""HTML+CSS基础教程8小时带领大家步步深入学习标签用法和意义""初级"219));
        map.put(15l, new Product(15l, "HTML/CSS""HTML+CSS基础课程""HTML+CSS基础教程8小时带领大家步步深入学习标签用法和意义""初级"219));
        map.put(16l, new Product(16l, "HTML/CSS""HTML+CSS基础课程""HTML+CSS基础教程8小时带领大家步步深入学习标签用法和意义""初级"219));
        map.put(17l, new Product(17l, "HTML/CSS""HTML+CSS基础课程""HTML+CSS基础教程8小时带领大家步步深入学习标签用法和意义""初级"219));
        map.put(18l, new Product(18l, "HTML/CSS""HTML+CSS基础课程""HTML+CSS基础教程8小时带领大家步步深入学习标签用法和意义""初级"219));
        map.put(19l, new Product(19l, "HTML/CSS""HTML+CSS基础课程""HTML+CSS基础教程8小时带领大家步步深入学习标签用法和意义""初级"219));
        map.put(20l, new Product(20l, "HTML/CSS""HTML+CSS基础课程""HTML+CSS基础教程8小时带领大家步步深入学习标签用法和意义""初级"219));
    }
    /*
        创建一个返回值为List的getProducts类
        为了在getProducts中的修改不影响到商品初始化信息,可以实例化一个新的List对象,把value值放入
     */
    public static List<Product> getProducts() {
        return new ArrayList<>(map.values());
    }
}
 
package com.imooc.cart.servlet;
 
import com.imooc.cart.data.LocalCache;
 
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;
 
@WebServlet("/product/list.do")
public class ProductServlet extends HttpServlet {
    @Override
    public void init() throws ServletException {
        super.init();
    }
 
    @Override
    protected void service(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        request.setAttribute("product", LocalCache.getProducts());
        request.getRequestDispatcher("/WEB-INF/views/biz/list.jsp").forward(request, response);
    }
 
    @Override
    public void destroy() {
        super.destroy();
    }
}
 
<%@page contentType="text/html; charset=UTF-8" language="java" %>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<html>
<head>
    <meta charset="UTF-8">
    <title>课程</title>
    <link rel="stylesheet" href="../../../css/list.css">
</head>
<body>
<!-- 头部 -->
<header class="header">
    <div class="logo"></div>
    <div class="nav">
        <a href="/product/list.do" class="nav__item nav__course">课程</a>
        <a href="" class="nav__item nav__item_icon_new">职业路径<i class="icon_new"></i></a>
        <a href="" class="nav__item">实战</a>
        <a href="" class="nav__item">猿问</a>
        <a href="" class="nav__item">手记</a>
    </div>
    <div class="profile">
        <a href="/cart/list.do" class="profile__item profile__car"></a>
        <a href="" class="profile__item profile__message"></a>
        <a href="" class="profile__item profile__ava"></a>
    </div>
    <div class="search"><input type="text" class="search_input"><a href="" class="search_submit"></a></div>
</header>
<div id="main">
    <div class="wrap">
    </div>
    <!-- 课程列表 -->
    <div class="course-list">
        <c:forEach items="${products}" var="product">
            <div class="course-card-container">
                <div class="course-card">
                    <div class="course-card-top">
                        <span>${product.tag}</span>
                    </div>
                    <div class="course-card-content">
                        <%--<a href="/detail/detail.do?productId=${product.id}">--%>
                            <h3>${product.name}-${product.id}</h3>
                            <p>${product.desc}</p>
                        </a>
                        <div class="course-card-bottom">
                            <span>${product.level}</span>
                            <span>
                                <a href="/cart/cart.do?productId=${product.id}">
                                    &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                                </a>
                            </span>
                            <a href="/favorite/favorite.do?productId=${product.id}">
                                <span></span>
                            </a>
                        </div>
                    </div>
                </div>
                <div class="course-card-bk">
                    <img src="../../../img/bk1.jpg" alt="">
                </div>
            </div>
        </c:forEach>
    </div>
</div>
<!-- 尾部 -->
<footer class="footer">
    <div class="waper">
        <div class="footerWaper">
            <div class="followus">
                <a href="" class="followus_weixin">
                    <div class="flw-weixin-box"></div>
                </a>
                <a href="" class="followus_weibo"></a>
                <a href="" class="followus_qzone"></a>
            </div>
            <div class="footer_intro">
                <div class="footer_link">
                    <ul>
                        <li><a href="">网站首页</a></li>
                        <li><a href="">企业合作</a></li>
                        <li><a href="">人才招聘</a></li>
                        <li><a href="">联系我们</a></li>
                        <li><a href="">讲师招募</a></li>
                        <li><a href="">常见问题</a></li>
                        <li><a href="">意见反馈</a></li>
                        <li><a href="">慕课大学</a></li>
                        <li><a href="">友情链接</a></li>
                    </ul>
                </div>
                <p>Copyright © 2017 imooc.com All Rights Reserved | 京ICP备 13046642号-2</p>
            </div>
        </div>
    </div>
</footer>
</body>
</html>

我的css样式和img图片也都全部放入了,控制台也没有报错,jar包导入正常,以下是我的文件路径、各个包名以及运行显示的结果http://img1.sycdn.imooc.com//climg/5cb8463e00012b6105040656.jpghttp://img1.sycdn.imooc.com//climg/5cb8465c000118c519200891.jpg

尾部的footer也是能够正常显示的

正在回答

登陆购买课程后可参与讨论,去登陆

7回答

你好!老师的代码里还有两个样式文件,你也放进去引入一下试试,因为我看到头部和尾部的样式是正常的,所以应该引入没问题。

http://img1.sycdn.imooc.com//climg/5cb9a6070001bc5802330127.jpg

祝学习愉快!

  • 巴呆丶 提问者 #1
    我在浏览器的工具项里清除了图片缓存,并且也加入了三个样式还是这样。需要我提供下自己的这个list.jsp吗
    2019-04-19 18:52:20
  • 巴呆丶 提问者 #2
    我怕是自己的jsp代码问题
    2019-04-19 18:55:06
  • 好帮手慕珊 回复 提问者 巴呆丶 #3
    行,你把改好的代码再贴一遍吧
    2019-04-19 19:39:44
提问者 巴呆丶 2019-04-19 20:08:20
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
<%@page contentType="text/html; charset=UTF-8" language="java" %>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<html>
<head>
    <meta charset="UTF-8">
    <title>课程</title>
    <link rel="stylesheet" href="http://localhost:8080/css/list.css">
</head>
<body>
<!-- 头部 -->
<header class="header">
    <div class="logo"></div>
    <div class="nav">
        <a href="/product/list.do" class="nav__item nav__course">课程</a>
        <a href="" class="nav__item nav__item_icon_new">职业路径<i class="icon_new"></i></a>
        <a href="" class="nav__item">实战</a>
        <a href="" class="nav__item">猿问</a>
        <a href="" class="nav__item">手记</a>
    </div>
    <div class="profile">
        <a href="/cart/list.do" class="profile__item profile__car"></a>
        <a href="" class="profile__item profile__message"></a>
        <a href="" class="profile__item profile__ava"></a>
    </div>
    <div class="search"><input type="text" class="search_input"><a href="" class="search_submit"></a></div>
</header>
<div id="main">
    <div class="wrap">
    </div>
    <!-- 课程列表 -->
 
    <div class="container">
        <div class="course-list">
            <c:forEach items="${products}" var="product">
                <div class="course-card-container" style="inline">
                    <div class="course-card">
                        <div class="course-card-top">
                            <span>${product.tag}</span>
                        </div>
                        <div class="course-card-content">
                            <a href="/detail/detail.do?productId=${product.id}">
                                <h3>${product.name}-${product.id}</h3>
                                <p>${product.desc}</p>
                            </a>
                            <div class="course-card-bottom">
                                <span>${product.level}</span>
                                <span>
                                <a href="/cart/cart.do?productId=${product.id}">
                                    &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                                </a>
                            </span>
                                <a href="/favorite/favorite.do?productId=${product.id}">
                                    <span></span>
                                </a>
                            </div>
                        </div>
                    </div>
                    <div class="course-card-bk">
                        <img src="../../../img/bk1.jpg" alt="">
                    </div>
                </div>
            </c:forEach>
        </div>
    </div>
</div>
 
<!-- 尾部 -->
<footer class="footer">
    <div class="waper">
        <div class="footerWaper">
            <div class="followus">
                <a href="" class="followus_weixin">
                    <div class="flw-weixin-box"></div>
                </a>
                <a href="" class="followus_weibo"></a>
                <a href="" class="followus_qzone"></a>
            </div>
            <div class="footer_intro">
                <div class="footer_link">
                    <ul>
                        <li><a href="">网站首页</a></li>
                        <li><a href="">企业合作</a></li>
                        <li><a href="">人才招聘</a></li>
                        <li><a href="">联系我们</a></li>
                        <li><a href="">讲师招募</a></li>
                        <li><a href="">常见问题</a></li>
                        <li><a href="">意见反馈</a></li>
                        <li><a href="">慕课大学</a></li>
                        <li><a href="">友情链接</a></li>
                    </ul>
                </div>
                <p>Copyright © 2017 imooc.com All Rights Reserved | 京ICP备 13046642号-2</p>
            </div>
        </div>
    </div>
</footer>
</body>
</html>

说一下样式加载失败的原因吧,是因为缺少了<div class="container">这个标签导致样式加载失败

  • 好的,能自己找到原因很棒。祝学习愉快!
    2019-04-20 09:53:54
好帮手慕珊 2019-04-19 18:08:16

你好!把下面这个css地址写成服务器地址试试呢,比如:http://localhost:8080/项目名称/css/list.css

http://img1.sycdn.imooc.com//climg/5cb99ded0001aed604680094.jpg

祝学习愉快!

  • 提问者 巴呆丶 #1
    我先试试,这是css格式没用上的原因吗
    2019-04-19 18:28:34
  • 提问者 巴呆丶 #2
    试了一下,没有效果
    2019-04-19 18:30:25
  • 好帮手慕珊 回复 提问者 巴呆丶 #3
    是样式的原因,清一下浏览器缓存再试试。
    2019-04-19 18:40:22
提问者 巴呆丶 2019-04-19 15:36:07

http://img1.sycdn.imooc.com//climg/5cb97a34000101c312750969.jpg

这是经过我更正代码后运行的界面,图片背景和内容显示个式都有些问题,应该还是list.jsp代码的问题

好帮手慕珊 2019-04-19 10:23:59

你好!看一下下面的两段代码,Servlet中,setAttribute()方法中的属性名是product,而jsp页面中获取值时是products。所以建议改一下Servlet中的值,改为products

http://img1.sycdn.imooc.com//climg/5cb930e700011e5006850154.jpg

http://img1.sycdn.imooc.com//climg/5cb930ce00015f3106410313.jpg

如果我的回答解决了你的疑惑,请采纳!祝学习愉快!

  • 提问者 巴呆丶 #1
    老师,这个问题我早上通过检查已经改正。但是页面显示内容和老师的不太一样,等会儿截图给老师看
    2019-04-19 11:07:17
提问者 巴呆丶 2019-04-19 09:37:16
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
package com.imooc.cart.servlet;
 
import com.imooc.cart.data.LocalCache;
 
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;
 
@WebServlet("/product/list.do")
public class ProductServlet extends HttpServlet {
    @Override
    public void init() throws ServletException {
        super.init();
    }
 
    @Override
    protected void service(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        request.setAttribute("product", LocalCache.getProducts());
        request.getRequestDispatcher("/WEB-INF/views/biz/list.jsp").forward(request, response);
    }
 
    @Override
    public void destroy() {
        super.destroy();
    }
 
}


芝芝兰兰 2019-04-18 20:08:06

同学你好。我们测试了一下,body里面是可以输出数据的:

http://img1.sycdn.imooc.com//climg/5cb867d300010dc907420317.jpg

http://img1.sycdn.imooc.com//climg/5cb867ea0001407712580730.jpg

老师猜测是同学的缓存LocalCache.getProducts()中没有数据,同学可以再检查一下Service的代码。

如果没有解决,同学再贴一下Service代码。祝学习愉快~

  • 提问者 巴呆丶 #1
    老师您说的Service代码是指LocalCache中的代码吗
    2019-04-19 09:04:47
  • 提问者 巴呆丶 #2
    经过我测试发现可以通过LocalCahe.getProducts();获得缓存中数据的地址值,但是在使用setAttribute()后,通过getAttribute()取出的值就变成了null,我把Servlet的代码重新粘贴在回复区
    2019-04-19 09:36:42
问题已解决,确定采纳
还有疑问,暂不采纳

恭喜解决一个难题,获得1积分~

来为老师/同学的回答评分吧

0 星
从网页搭建入门Java Web2018版
  • 参与学习           人
  • 提交作业       1088    份
  • 解答问题       10204    个

如果你有Java语言基础,又想以后从事Java Web开发,那么本路径是你的不二选择!本路径从网页搭建开始入手,通过大量案例来学习Java Web基础。定能助你完成Java Web小白的蜕变!

了解课程
请稍等 ...
微信客服

购课补贴
联系客服咨询优惠详情

帮助反馈 APP下载

慕课网APP
您的移动学习伙伴

公众号

扫描二维码
关注慕课网微信公众号

在线咨询

领取优惠

免费试听

领取大纲

扫描二维码,添加
你的专属老师
插入代码