【案例】實現商品列表展示 · JavaWeb學習

PhoneListServlet.java ~~~ package zyw.JSP; import zyw.bean.Phone; 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; import java.util.ArrayList; import java.util.List; @WebServlet(name = "PhoneListServlet",urlPatterns = "/phonelist") public class PhoneListServlet extends HttpServlet { protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { } protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { //通過servlet從數據庫中獲取數據，我們這里暫時通過手動創建數據 Phone phone=new Phone();//鼠標放在Phone上Alt+Enter快捷鍵建立Phone類 phone.setName("iphone6"); phone.setId(001); phone.setImage("https://img10.360buyimg.com/n7/jfs/t277/193/1005339798/768456/29136988/542d0798N19d42ce3.jpg"); phone.setPrice("3900"); Phone phone1=new Phone(); phone1.setName("堅果pro"); phone1.setId(002); phone1.setPrice("1799"); phone1.setImage("https://img13.360buyimg.com/n7/jfs/t5377/56/1578379545/209772/32105f74/5911bcbdN7afa707b.jpg"); Phone phone2=new Phone(); phone2.setName("vivo x9"); phone2.setPrice("2345"); phone2.setId(003); phone2.setImage("https://img12.360buyimg.com/n7/jfs/t6067/340/2101390376/231820/750cc50e/593aa83fN8b0829fc.jpg"); Phone phone3=new Phone(); phone3.setName("oppo A57"); phone3.setId(004); phone3.setPrice("1399"); phone3.setImage("https://img10.360buyimg.com/n7/jfs/t4978/185/135948089/78285/f6a84203/58db6fa4N354322d9.jpg"); Phone phone4=new Phone(); phone4.setName("諾基亞6"); phone4.setId(005); phone4.setPrice("1699"); phone4.setImage("https://img11.360buyimg.com/n7/jfs/t4930/86/192598423/86027/36a57ccf/58dcbfa5N5c41cbfd.jpg"); Phone phone5=new Phone(); phone5.setName("小米MIX"); phone5.setId(006); phone5.setPrice("3999"); phone5.setImage("https://img13.360buyimg.com/n7/jfs/t4264/215/455518113/309855/38fe41f1/58b4fc81N1d924112.jpg"); List<Phone> list=new ArrayList<>(); list.add(phone); list.add(phone1); list.add(phone2); list.add(phone3); list.add(phone4); list.add(phone5); request.setAttribute("list",list); request.getRequestDispatcher("/phone_list.jsp").forward(request,response); } } ~~~ Phone.java ~~~ package zyw.bean; public class Phone { private int id; private String name; private String image; private String price; //Art+Ins快捷鍵加入get,set方法 public int getId() { return id; } public void setId(int id) { this.id = id; } public String getName() { return name; } public void setName(String name) { this.name = name; } public String getImage() { return image; } public void setImage(String image) { this.image = image; } public String getPrice() { return price; } public void setPrice(String price) { this.price = price; } } ~~~ phone_list.jsp ~~~ <%-- Created by IntelliJ IDEA. User: Administrator Date: 2018/7/16 Time: 13:26 To change this template use File | Settings | File Templates. --%> <%@ page contentType="text/html;charset=UTF-8" language="java" %> <%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%> <html> <head> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>商品列表</title> </head> <body> <c:forEach items="${list}" var="phone"> <div class="col-md-2" style="height:250px"> <img src="${phone.image}" width="170" height="170" style="display: inline-block;"> </a> <p> <a href="product_info.html" style='color: green'>${phone.name}</a> </p> <p> <font color="#FF0000">商城價：¥${phone.price}</font> </p> </c:forEach> </div> </body> </html> ~~~ ![](https://box.kancloud.cn/97cb252e49505d0576e04fd6f5d4eb63_304x725.png)