衡阳城乡建设局网站,wordpress SORA 主题,天津市建设工程合同备案网站,福州网站建设fjfzwl目录 一.什么是MVC设计模式#xff1f; 1.2 MVC设计模式有什么优点#xff1f;
二.MVC运用#xff08;家居商城#xff09;
2.1 实现登录
2.2 绑定轮播【随机三个商品】
2.2.1 效果预览
index.jsp 2.3 绑定最新上架热门家居
2.3.1 效果预览 2.3.2 代码实现
数据…目录 一.什么是MVC设计模式 1.2 MVC设计模式有什么优点
二.MVC运用家居商城
2.1 实现登录
2.2 绑定轮播【随机三个商品】
2.2.1 效果预览
index.jsp 2.3 绑定最新上架热门家居
2.3.1 效果预览 2.3.2 代码实现
数据库脚本 2.4 页面包含
2.4.1 语法 2.4.2 处理
注意${param.key} 相当于request.getParameter(key)用于jsp页面取值 首页(current) 分类 //登录成功后 跳转到主界面的加载数据处 让首页默认选中
resp.sendRedirect(indedx.do?index1)
2.5 登录与否判断
--登录了则导航条上出现登录名并不显示登录而显示退出 退出 req.setCharacterEncoding(utf-8); HttpSession session req.getSession(); session.setAttribute(user, null); resp.sendRedirect(login.jsp); --没有登录才显示登录注册选项 登录 注册
一.什么是MVC设计模式 1.2 MVC设计模式有什么优点
①降低代码耦合性在MVC模式中三个层各司其职所有如果一旦哪一层的需求发生了变化就只需要更改相应层的代码而不会影响到其他层的代码
②有利于分工合作在MVC模式中由于按层把系统分开那么就能更好的实现开发中的分工网页设计人员可进行开发视图层中的JSP而对业务熟悉的人员可开发业务层而其他开发人员可开发控制层
③有利于组件的重用如控制层可独立成一个能用的组件表示层也可做成通用的操作界面可以为一个模式在运行时同时建立和使用多个视图
二.MVC运用家居商城
2.1 实现登录 package com.zking.servlet;import java.io.IOException;
import java.io.PrintWriter;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 javax.servlet.http.HttpSession;import com.zking.biz.IUserBiz;
import com.zking.biz.UserBiz;
import com.zking.entity.User;/*** 登录业务处理 控制器* author PC**/
WebServlet(/login.do)
public class LoginServlet extends HttpServlet {Overrideprotected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {doPost(req, resp);}Overrideprotected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {//设置编码req.setCharacterEncoding(utf-8);resp.setContentType(text/html; charsetUTF-8);//拿session和outHttpSession session req.getSession();PrintWriter out resp.getWriter();//接收表单提交过来的值 用户名 密码String unamereq.getParameter(uname);String upwdreq.getParameter(upwd);//servlet调用bizIUserBiz iub new UserBiz();//调用登录方法User u iub.login(uname, upwd);//判断if(u!null) {//存起来sessionsession.setAttribute(user, u);//键 值//跳转到主界面 index.do加载数据resp.sendRedirect(index.do?index1);//为了让首页选中}else {out.print(scrpitalert(用户名或者密码有误)location.hreflogin.jsp;/scrpit);}}
}2.2 绑定轮播【随机三个商品】
2.2.1 效果预览 index.jsp !--轮播效果 --div classcontainerdiv idcarouselExampleCaptions classcarousel slide data-ridecarouselol classcarousel-indicatorsli data-target#carouselExampleCaptions data-slide-to0 classactive/lili data-target#carouselExampleCaptions data-slide-to1/lili data-target#carouselExampleCaptions data-slide-to2/li/oldiv classcarousel-innerc:forEach items${lbls} varg varStatusvsdiv classcarousel-item ${vs.index0?active:}img src${g.gpath} width100% height500px alt...div classcarousel-caption d-none d-md-blockh5${g.gname}/h5p${g.ginfo}/p/div/div/c:forEach 2.3 绑定最新上架热门家居
2.3.1 效果预览 2.3.2 代码实现
数据库脚本
--类别表
create table tb_type
(tid NUMBER,--类别idtname VARCHAR2(20) --类别名称
)
--插入数据
insert into tb_type (tid, tname)
values (1, 布艺软饰);
insert into tb_type (tid, tname)
values (2, 装饰摆件);
insert into tb_type (tid, tname)
values (3, 蜡艺香薰);
insert into tb_type (tid, tname)
values (4, 墙饰壁挂);
insert into tb_type (tid, tname)
values (5, 创意家居);
commit;--商品表 tb_goods
--插入数据
insert into tb_goods (gid, gname, tid, gprice, gxl, gtime, gpath, ginfo)
values (1, 商品3, 3, 45.4, 38, 2023-01-01, img/bz02.jpg, 不畏将来不念过往);
insert into tb_goods (gid, gname, tid, gprice, gxl, gtime, gpath, ginfo)
values (2, 商品2, 4, 29.9, 8, 2022-10-23, img/bz04.jpg, 夏天有着迟暮的霞光,正如晚来的你,皆是笑意);
insert into tb_goods (gid, gname, tid, gprice, gxl, gtime, gpath, ginfo)
values (3, 毛茸茸的小物件, 5, 12.9, 104, 2018-02-04, img/bz05.jpg, 世界的温柔是晚来的善意和干净的你);
insert into tb_goods (gid, gname, tid, gprice, gxl, gtime, gpath, ginfo)
values (4, 可爱舒适的抱枕, 2, 38.8, 91, 2023-13-09, img/bz03.jpg, 人间骄阳正好风过林梢彼时还正当年少);
insert into tb_goods (gid, gname, tid, gprice, gxl, gtime, gpath, ginfo)
values (5, 商品12, 2, 18.8, 45, 2022-01-23, img/bz12.jpg, 踏月而来这繁星便是赠礼);
insert into tb_goods (gid, gname, tid, gprice, gxl, gtime, gpath, ginfo)
values (6, 商品1, 2, 23.9, 145, 2021-02-23, img/bz06.jpg, 你被黑暗敲打恰恰说明你是光明本身);
insert into tb_goods (gid, gname, tid, gprice, gxl, gtime, gpath, ginfo)
values (7, 商品666, 1, 89.9, 888, 2020-11-22, img/bz11.jpg, 回首亘年漫月里所有怦然心动你仍拨得头筹);
insert into tb_goods (gid, gname, tid, gprice, gxl, gtime, gpath, ginfo)
values (8, 好看的花呀, 3, 9.9, 666, 2019-02-20, img/bz10.jpg, 最美是牵着你的手一路狂奔);
insert into tb_goods (gid, gname, tid, gprice, gxl, gtime, gpath, ginfo)
values (9, 北欧家具, 1, 4.5, 10, 2022-12-24, img/bz08.jpg, 生活很暗抱歉我也没光);
insert into tb_goods (gid, gname, tid, gprice, gxl, gtime, gpath, ginfo)
values (10, 商品13, 4, 9.9, 100, 2020-12-20, img/bz09.jpg, 清水煮岁月不悲不喜);
commit;!-- 最新上架①或②--!-- 微章方式 ①--!-- div classh2 stylemargin-top: 10px;span classbadge badge-danger 最新上架/span/div --!-- 背景图片方式② --div classbq最新上架/divdiv classrowc:forEach items${zxls} vargdiv classcol!-- 画像 text-center居中--figure classfigure text-center!--a hrefxq.do?gid${g.gid} 详情页面 自己写 --a hrefxq.do?gid${g.gid} img src${g.gpath} classfigure-img img-fluid rounded alt.../afigcaption classfigure-captionb${g.gname}/bnbsp;byen;${g.gprice}/b/figcaption/figure/div/c:forEach/div!-- 热门家居 --div classbq热门家居/divdiv classrowc:forEach items${xlls} vargdiv classcol!-- 画像 text-center居中--figure classfigure text-center!--a hrefxq.do?gid${g.gid} 详情页面 自己写 --a hrefxq.do?gid${g.gid} img src${g.gpath} classfigure-img img-fluid rounded alt.../afigcaption classfigure-captionb${g.gname}/bnbsp;byen;${g.gprice}/b/figcaption/figure/div/c:forEach/div2.4 页面包含
2.4.1 语法 !--页面包含 -- jsp:include pageheader.jsp/jsp:include
% page languagejava contentTypetext/html; charsetUTF-8pageEncodingUTF-8%
% taglib urihttp://java.sun.com/jsp/jstl/core prefixc%
!DOCTYPE html
html langenheadmeta charsetUTF-8meta http-equivX-UA-Compatible contentIEedgemeta nameviewport contentwidthdevice-width, initial-scale1.0title案例1首页最新上架热门家居实现/title!-- 支持手机端 --meta nameviewport contentwidthdevice-width,initial-scale1.0!-- 引入CSS --link relstylesheet hrefCSS/bootstrap.css /style.navbar-collapse {/*1代表弹性扩大占用父容器剩余部分 0代表不占用*/flex-grow: 0;}.active {font-weight: bold;/*加粗*/}/style
/headbody!-- 导航条 --nav classnavbar navbar-expand-lg navbar-light bg-light!-- 固定容器 --div classcontainera classnavbar-brand href#你好b${user.uname}/b,欢迎来到集美家居/abutton classnavbar-toggler typebutton data-togglecollapse data-target#navbarNavaria-controlsnavbarNav aria-expandedfalse aria-labelToggle navigationspan classnavbar-toggler-icon/span/buttondiv classcollapse navbar-collapse idnavbarNavul classnavbar-nav!-- active激活的 --li classnav-item ${param.index1?active:}a classnav-link hrefindex.do?index1首页span classsr-only(current)/span/a/lili classnav-item ${param.index2?active:}a classnav-link hreftype.jsp?index2分类/a/lic:if test${empty user}!--没登录 --li classnav-itema classnav-link hreflogin.jsp登录/a/lili classnav-itema classnav-link 注册/a/li/c:ifc:if test${not empty user}!--登录 --li classnav-itema classnav-link hrefexit.do退出/a/li/c:ifli classnav-item ${param.index5?active:}a classnav-link hrefcart.jsp?index5我的购物车/a/li/ul/div/div/nav!-- 引入jQuery的类库 --!-- 再引入Bootstrap的类库 --script srcjs/jquery-3.6.4.js/scriptscript srcjs/bootstrap.js/script
/body/html
2.4.2 处理
注意${param.key} 相当于request.getParameter(key)用于jsp页面取值 ul classnavbar-nav !-- active激活的 -- li classnav-item ${param.index1?active:} a classnav-link hrefindex.do?index1首页span classsr-only(current)/span/a /li li classnav-item ${param.index2?active:} a classnav-link hreftype.jsp?index2分类/a /li /ul //登录成功后 跳转到主界面的加载数据处 让首页默认选中 resp.sendRedirect(indedx.do?index1) 2.5 登录与否判断
--登录了则导航条上出现登录名并不显示登录而显示退出 c:if test${not empty user}!--登录 -- li classnav-item a classnav-link hrefexit.do退出/a /li /c:if req.setCharacterEncoding(utf-8); HttpSession session req.getSession(); session.setAttribute(user, null); resp.sendRedirect(login.jsp); --没有登录才显示登录注册选项 c:if test${empty user}!--没登录 -- li classnav-item a classnav-link hreflogin.jsp登录/a /li li classnav-item a classnav-link hrefregister.jsp注册/a /li /c:if
