【JAVAWEB开发】基于Java+Servlet+Ajax+jsp网上购物系统设计实现_javaweb 用ajax实现购物车-程序员宅基地

技术标签: java  html5  # JAVAWEB开发  servlet  ajax  

哈喽~大家好呀,这篇给的大家带来的是网上购物系统设计。在传统电商时代,用户是先有需求再购买,用户对平台较为依赖,商家对消费者很难有直接的影响力,而如今社交 + 电商解决了产品质量的信息不对称问题,电商已经成为当今经济发展的一个重要领域。而网上购物就是实现之一,现在我们就来看看吧。

号外号外,我最近发现了一个非常棒的人工智能学习网站,它的内容通俗易懂,风趣幽默,让人印象深刻。我想和大家分享这个网站,点击链接即可访问。 

一、效果演示

1、首页界面

 如果没有登录,就只能查看无法购买

2、商品界面

 3、商品详情界面

 4、购物车界面

 5、购物订单界面

 6、交易成功界面

 7、个人订单界面

8、个人收藏界面

 9、管理员界面

 10、全部订单界面

 11、全部收藏界面

 二、数据库设计

数据库定义:数据库是存放数据的仓库。它的存储空间很大,可以存放百万条、千万条、上亿条数据。但是数据库并不是随意地将数据进行存放,是有一定的规则的,否则查询的效率会很低。当今世界是一个充满着数据的互联网世界,充斥着大量的数据。即这个互联网世界就是数据世界。数据的来源有很多,比如出行记录、消费记录、浏览的网页、发送的消息等等。除了文本类型的数据,图像、音乐、声音都是数据。

用户表(user):字段(id,用户名,密码,电话,邮箱)

购物车表(shopping_cart):字段(id,用户名,商品名,价格,购买数量,总价,图片地址)

订单表(order):字段(id,商品名,邮箱,用户名,收货地址,收货电话)

商品详情表(goods_parameters):字段(id,商品类型,图片地址)

商品类型(favorite):字段(id,商品类型名)

商品表(user):字段(id,商品名,商品类型名,价格,图片地址,销量,库存)

收藏表(favorite):字段(id,用户名,商品名,价格,图片地址)

历史记录表(browsinghistory):字段(id,记录名,记录价格,记录图片地址)、

品牌表(brand):字段(id,用户名,品牌类型,品牌名)

三、部分代码展示

登录展示

    <div class="registerarea ">
        <!-- 注册表头部 -->
        <h4>登录账号
            <div class="login"> 没有账号,去<a href="register.jsp" class="style_red">注册</a> &nbsp;&nbsp; <a href="retrievePassword.jsp">忘记密码?点击找回</a></div>
        </h4>
        <!-- 注册表身体 -->
        <div class="reg_form">
            <form action="/EasybuyProject/loginServlet" class="submit" method="post">
                <ul class="clearfix:after">
                    <li>
                        <label>账号:</label> <input type="text" class="inp username" name="username">
                        <span class="error">格式错误,应为长度6-20并含有大小写字母数字</span>
                        <font color="red">
                            <%
                                if(session.getAttribute("messageLogin")!= null){
                                    out.print(session.getAttribute("messageLogin"));
                                    session.invalidate();
                                }
                            %>
                        </font>


                    </li>

                    <li>
                        <label>密码:</label> <input type="password" class="inp password" name="password">
<%--                        <span class="error">格式错误,应为长度6-20并含有大小写字母数字</span>--%>
                    </li>
                    <li>
                        <input type="submit" class="inputButton" value="登录"> &nbsp;&nbsp;
                        <input type="reset" value="重置" class="inputButton">
                    </li>
                </ul>
            </form>
        </div>
    </div>

正则验证

    <script>
        $(document).ready(function () {
            $(function () {
                var flagUser = false
                var flagPwd = false

                var $user_name = $('.username')
                var $pwd = $('.password')

                $user_name.blur(function () {
                    var vals = $user_name.val();
                    var reg = /^[a-zA-Z0-9\_]{6,20}$/;
                    if (reg.test(vals)) {
                        $user_name.next().hide();
                        flagUser = true;
                    } else {
                        // $user_name.next().show().css("z-index","2").html('用户名是6-20位数字、字母和下划线!');
                        $user_name.next().show();
                        flagUser = false;
                    }
                })

                $pwd.blur(function () {
                    var vals = $pwd.val();
                    var reg = /^[a-zA-Z0-9\_]{6,20}$/;

                    if (reg.test(vals)) {
                        $pwd.next().hide();
                        flagPwd = true;
                    } else {
                        $pwd.next().show();
                        flagPwd = false;
                    }
                })

            })
        })
    </script>

Servlet

@WebServlet("/EasybuyProject/loginServlet")
public class LoginServlet extends HttpServlet {

    @Override
    protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
        doPost(req, resp);
    }

    @Override
    protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {

        req.setCharacterEncoding("utf8");
        resp.setCharacterEncoding("utf8");
        resp.setContentType("text/html;charset=UTF-8");

        String username = req.getParameter("username");
        String password = req.getParameter("password");

        UserService userService = new UserServiceImpl();
        User user = userService.login(username, password);

        HttpSession session = req.getSession();

        if (user != null && (!Objects.equals(username, "XzwadminNo1")) && !Objects.equals(password, "XzwadminNo1")) {
            resp.sendRedirect("/FrontPage/index.jsp");
            session.setAttribute("success",username);
        } else if(Objects.equals(username, "XzwadminNo1") && Objects.equals(password, "XzwadminNo1")){
            session.setAttribute("success",username);
            resp.sendRedirect("/FrontPage/indexAdmin.jsp");
        } else {
            session.setAttribute("messageLogin","用户名或者密码错误");
            resp.sendRedirect("/FrontPage/login.jsp");
        }

    }

}

实体类

public class User {

    private int id;
    private String username;
    private String password;
    private String tel;
    private String email;

    public User() {
    }

    public User(String tel, String email) {
        this.tel = tel;
        this.email = email;
    }

    public User(int id, String username, String password, String tel, String email) {
        this.id = id;
        this.username = username;
        this.password = password;
        this.tel = tel;
        this.email = email;
    }

    public int getId() {
        return id;
    }

    public void setId(int id) {
        this.id = id;
    }

    public String getUsername() {
        return username;
    }

    public void setUsername(String username) {
        this.username = username;
    }

    public String getPassword() {
        return password;
    }

    public void setPassword(String password) {
        this.password = password;
    }

    public String getTel() {
        return tel;
    }

    public void setTel(String tel) {
        this.tel = tel;
    }

    public String getEmail() {
        return email;
    }

    public void setEmail(String email) {
        this.email = email;
    }

    @Override
    public String toString() {
        return "User{" +
                "id=" + id +
                ", username='" + username + '\'' +
                ", password='" + password + '\'' +
                ", tel='" + tel + '\'' +
                ", email='" + email + '\'' +
                '}';
    }
}

Dao

    public User login(String username, String password) {
        User user = null;
        Connection connection = null;
        PreparedStatement preparedStatement = null;
        ResultSet resultSet = null;

        try {
            connection = JdbcUtil.getConnection();
            String sql = "select * from user where username = ? and password= ?";
            preparedStatement = connection.prepareStatement(sql);
            preparedStatement.setString(1, username);
            preparedStatement.setString(2, password);

            resultSet = preparedStatement.executeQuery();
            if (resultSet.next()) {
                user = new User();
                user.setUsername(resultSet.getString("username"));
                user.setPassword(resultSet.getString("password"));
            }
        } catch (Exception e) {
            e.printStackTrace();
        } finally {
            JdbcUtil.release(resultSet, preparedStatement, connection);
        }
        return user;
    }

效果展示

源码获取见公众号

不积跬步无以至千里,趁年轻,使劲拼,给未来的自己一个交代!向着明天更好的自己前进吧!

版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
本文链接:https://blog.csdn.net/aasd23/article/details/126644476

智能推荐

13多态_设计主人给多个宠物喂食,要求通过对象多态性完成主人类喂食方法的灵活调用。-程序员宅基地

文章浏览阅读65次。多态@Override 规范上 推荐加上 帮你校验是否是方法重写**方法重写:**在子类继承了父类的方法之后,如果发现在当前的需求下,父类的方法不够强大,所以在子类中就可以对此方法进行重写。特点:1. 方法名相同2. 参数列表相同3. 返回值类型不能大于父类4. 访问修饰符不能严于父类**方法重载:**在同一个类中,方法名相同,参数列表不同(类型,个数,顺序),与方法的返回值类..._设计主人给多个宠物喂食,要求通过对象多态性完成主人类喂食方法的灵活调用。

千字文-程序员宅基地

文章浏览阅读643次。简介参考“做教练”之硬笔书法, 掌握了基本笔画、偏旁部首后,可以较全面的临写一些古碑帖了。由南朝梁周兴嗣撰写的《千字文》,是一篇使用时间最长、影响最大、流传最广的儿童启蒙读物。它行文流畅、辞藻华丽、内容丰富、气势磅礴。在《千字文》的流传过程中,历代著名书法名家家如智永、怀素、褚遂良、欧阳询、宋徽宗、米芾、赵孟頫、文徵明、王福庵、邓石如等,把《千字文》作为范书写成字帖。他们的作品流传..._五体千字文为什么六种

Axure 9 实战案例,动态面板的应用 2,APP发布界面的键盘交互_axure9 动态面板添加文字-程序员宅基地

文章浏览阅读1.8k次。本次课程我们继续来学习一下,动态面板的应用。前一篇我们讲到了导航栏的背景设计,通过学习如何实现导航栏背景的100%宽度,相信大家已经掌握了一些动态面板的妙用;本篇我们在动态面板的基础上,增加一些其他交互,难度开始提高了哦。那么本篇我们就来讲解一下,如何在APP发布界面实现开关键盘?我们先来看一下完成效果图:大家可以看到,当折叠键盘时,文本域变高、添加位置向下移;当展开键盘时,文本域复原、添加位置复位。下面来给大家讲解一下实现的步骤。..._axure9 动态面板添加文字

HDU 3746 Cyclic Nacklace-程序员宅基地

文章浏览阅读45次。题意:给你几组字符串,每组添加多少个字符能够构成循环.题解:最小循环节,注意讨论的三种情况,题上刚好给了这三种情况(要是不给我这弱鸡又考虑不全了) 1 #include <iostream> 2 #include <cstring> 3 #include <string> 4 #include <algorithm&g...

深度学习基础--正则化与norm--L2归一化、L2正则化、L2范数的区别_norm_l2-程序员宅基地

文章浏览阅读2.9k次。L2归一化、L2正则化、L2范数的区别  1)归一化是将数据变到一定的区间内,故是x除以||x||_2。  2)正则化是在优化时所使用的概念,称为正则化方法,而不是指某种具体的数据运算,概念比归一化要高一层。  3)L2范数指的是公式意义上的||x||_2。..._norm_l2

【杂七杂八】excel中根据RTL信号位宽生成拼接取位_rtl语法 位宽拼接-程序员宅基地

文章浏览阅读398次。前言作为一个不务正业的芯片前端,总会遇到掉奇奇怪怪的需求,就比如题目这个啊,我写完之后就觉得非常的拗口。那么具体的需要是啥呢?就是比如说有了下面这个excel表:信号名 width sig0 3 sig1 10 sig2 14 sig3 20 sig4 8 要直接做一列生成前面几个信号在整体信号中的取位信息,简单来说就是这样:信号名 width local sig0 3 [2:0] sig1 10_rtl语法 位宽拼接

随便推点

五种IO模型-程序员宅基地

文章浏览阅读5.9k次,点赞10次,收藏10次。IO,即input/output,IO模型即输入输出模型,而比较常见且听说的便是磁盘IO,网络IO.按照冯诺依曼结构的来看,假设我们把运算器、控制器、存储器三个设备看做一个整体(假设称为中转),那么输入设备、输出设备,和中转就构成一个中转IO,也就是说IO是以某一个核心为的,而涉及计算机核心与其他核心之间的过程我们就成为一个IO._io模型

未来工厂大脑:图扑组态软件在智能制造中的应用-程序员宅基地

文章浏览阅读615次,点赞12次,收藏11次。图扑 HT 先进的组态界面非常适用于实时监控系统的界面呈现,多年来已广泛应用于电信网络拓扑和设备管理,以及工业生产、城市园区、轨道交通、电力能源、仓储物流、化工冶金等工业自动化(HMI/SCADA/MMI)领域,业务涵盖数据展示、态势感知、科学决策等全生命周期监控。图扑的大屏组态、UI 组态、工业组态、三维组态为打造精细化监控策略提供了支持,融合数字建模、数字孪生、仿真模拟、智能物流等技术,轻松构建低代码、零代码物联网 IoT 平台,辅助传统工厂向智能工厂转型。

Java核心技术·卷I(原书第12版)_java核心技术第十二版pdf-程序员宅基地

文章浏览阅读1w次。他是《Java核心技术》两卷本的作者,也是《重要的,第二版》(Addison-Wesley,2018)的Core Java SE 9和《重要的,第二版》(Addison-Wesley,2017)的作者。读者应在充分理解Java语言和Java类库的基础上,灵活应用Java提供的高级特性,包括面向对象编程、反射和代理、接口和内部类、异常处理、泛型编程、集合框架、事件监听器模型、图形用户界面设计和并发。☉第四章介绍了面向对象的两大基石——封装的重要概念,以及Java语言实现封装的机制——类和方法;_java核心技术第十二版pdf

【Gradle】Gradle配置全局阿里云镜像仓库_android studio gradle全局使用阿里云镜像 详细步骤-程序员宅基地

文章浏览阅读2.5k次。一、参考资料Gradle配置阿里云仓库_梁海江的博客-程序员宅基地Gradle的配置操作以及配置阿里云镜像和整合本地Maven仓库 - 简书_android studio gradle全局使用阿里云镜像 详细步骤

Maven手动导入jar包到自己仓库_maven手动导入jar包到仓库-程序员宅基地

文章浏览阅读1k次。1、保证settings.xml文件中的 localRepository 是自己需要引入的仓库。_maven手动导入jar包到仓库

(一)数据科学_聚类 样本外-程序员宅基地

文章浏览阅读419次。数据科学技术1 数据科学概念2 数理统计技术2.1 描述性统计分析2.2 统计推断与统计建模1 数据科学概念数据科学是一个发现、解释数据中的模式并用于解决问题的过程。数据科学可以从数据中获取知识,为行动提出建议的方法、技术和流程,以完成商业或工业上的目标。下图所示流程为数据科学的工作范式。反过来即为建模步骤。数据学是数据科学的基础。数据学研究数据本身,研究数据的各种类型、状态、属性及变化规律;数据科学是为科学研究的数据方法。2 数理统计技术2.1 描述性统计分析2.2 统计推断与统计建模_聚类 样本外