java Web实现用户登录功能

文章目录

  • 一、纯JSP方式实现用户登录功能
    • (一)实现思路
      • 1、创建Web项目
      • 2、创建登录页面
      • 3、创建登录处理页面
      • 4、创建登录成功页面
      • 5、创建登录失败页面
      • 6、编辑项目首页
    • (三)测试结果
  • 二、JSP+Servlet方式实现用户登录功能
    • (一)实现思路
    • (二)实现步骤
      • 1、创建Web项目
      • 2、创建登录页面
      • 3、创建登录处理程序
      • 4、创建登录成功页面
      • 5、创建登录失败页面
      • 6、编辑项目首页
    • (三)测试结果
  • 三、JSP+Servlet+DB方式实现用户登录功能
    • (一)实现思路
    • (二)实现步骤
      • 1、创建数据库
      • 2、创建用户表
      • 3、创建Web项目
      • 4、创建用户实体类
      • 5、添加数据库驱动程序
      • 6、创建数据库连接管理工具类
      • 7、创建用户数据访问类
      • 8、测试用户数据访问类
  • 四、采用MVC模式实现用户注册功能
      • 1、创建Web项目
      • 2、创建内容

一、纯JSP方式实现用户登录功能

(一)实现思路

登录页面login.jsp,输入用户名和密码后,跳转到登录处理页面doLogin.jsp进行业务逻辑处理,登录成功,跳转到登录成功页面success.jsp,否则跳转到登录失败页面failure.jsp。
(二)实现步骤

1、创建Web项目

  • 创建Java Enterprise项目,添加Web Application功能
    在这里插入图片描述
    在这里插入图片描述

  • 设置项目名与保存位置
    在这里插入图片描述

  • 单击【Finish】按钮

  • 在项目结构窗口里修改Artifact名 - LoginDemo01
    在这里插入图片描述

  • 编辑服务器配置,重新部署项目
    在这里插入图片描述

2、创建登录页面

  • 登录页面 - login.jsp
    原代码
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>用户登录</title>
</head>
<body>
<h3 style="text-align: center">用户登录</h3>
<form action="doLogin.jsp" method="post">
    <table border="1" cellpadding="10" style="margin: 0px auto">
        <tr>
            <td align="center">账号</td>
            <td><input type="text" name="username"/></td>
        </tr>
        <tr>
            <td align="center">密码</td>
            <td><input type="password" name="password"/></td>
        </tr>
        <tr align="center">
            <td colspan="2">
                <input type="submit" value="登录"/>
                <input type="reset" value="重置"/>
            </td>
        </tr>
    </table>
</form>
</body>
</html>

3、创建登录处理页面

  • 登录处理页面 - doLogin.jsp
    原代码
<%
    // 获取登录表单数据
    String username = request.getParameter("username");
    String password = request.getParameter("password");
    // 判断登录是否成功
    if (username.equals("易烊千玺") && password.equals("123456")) {
        // 跳转到登录成功页面,传递用户名
        response.sendRedirect("success.jsp?username=" + username);
    } else {
        // 跳转到登录失败页面,传递用户名
        response.sendRedirect("failure.jsp?username=" + username);
    }
%>

4、创建登录成功页面

  • 登录成功页面 - success.jsp
    原代码
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>登录成功</title>
</head>
<body>
<h3 style="text-align: center">恭喜,<%=request.getParameter("username")%>,登录成功!</h3>
</body>
</html>

5、创建登录失败页面

  • 登录失败页面 - failure.jsp
    原代码
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>登录失败</title>
</head>
<body>
<h3 style="text-align: center">遗憾,<%=request.getParameter("username")%>,登录失败!</h3>
</body>
</html>

6、编辑项目首页

  • 项目首页 - index.jsp
    原代码
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
  <head>
    <title>首页</title>
  </head>
  <body>
    <h1 style="color: red; text-align: center">纯JSP方式实现用户登录成功能</h1>
    <h3 style="text-align: center"><a href="login.jsp">跳转到登录页面</a></h3>
  </body>
</html>

(三)测试结果

  • 启动服务器,显示首页
    在这里插入图片描述

  • 单击【跳转到登录页面】超链接
    在这里插入图片描述

  • 输入正确的用户名和密码(易烊千玺:123456)
    在这里插入图片描述

  • 单击【登录】按钮,跳转到登录成功页面
    在这里插入图片描述

  • 返回登录页面,输入错误的用户名或密码
    在这里插入图片描述

  • 单击【登录】按钮,跳转到登录失败页面
    在这里插入图片描述

二、JSP+Servlet方式实现用户登录功能

(一)实现思路

  • 登录页面login.jsp,输入用户名和密码后,跳转到登录处理程序LoginServlet进行业务逻辑处理,登录成功,跳转到登录成功页面success.jsp,否则跳转到登录失败页面failure.jsp。

(二)实现步骤

1、创建Web项目

  • 创建Java Enterprise项目,添加Web Application功能
    在这里插入图片描述

  • 设置项目名与保存位置
    在这里插入图片描述

  • 单击【Finish】按钮

  • 在项目结构窗口里修改Artifact名 - LoginDemo02
    在这里插入图片描述

  • 编辑服务器配置,重新部署项目
    在这里插入图片描述

  • 切换到【Server】选项卡
    在这里插入图片描述

2、创建登录页面

  • 登录页面 - login.jsp
  • 原代码
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
    <head>
        <title>用户登录</title>
    </head>
    <body>
        <h3 style="text-align: center">用户登录</h3>
        <form action="login" method="post">
            <table border="1" cellpadding="10" style="margin: 0px auto">
                <tr>
                    <td align="center">账号</td>
                    <td><input type="text" name="username"/></td>
                </tr>
                <tr>
                    <td align="center">密码</td>
                    <td><input type="password" name="password"/></td>
                </tr>
                <tr align="center">
                    <td colspan="2">
                        <input type="submit" value="登录"/>
                        <input type="reset" value="重置"/>
                    </td>
                </tr>
            </table>
        </form>
    </body>
</html>

3、创建登录处理程序

创建net.xyx.serlvet包,在包里创建LoginServlet

package net.xyx.servlet;

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.net.URLEncoder;

@WebServlet(name = "LoginServlet", urlPatterns = "/login")
public class LoginServlet extends HttpServlet {
    protected void doPost(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException {
        // 设置请求对象字符编码格式
        request.setCharacterEncoding("utf-8");
        // 获取登录表单数据
        String username = request.getParameter("username");
        String password = request.getParameter("password");
        // 判断登录是否成功
        if (username.equals("无心剑") && password.equals("903213")) {
            // 采用重定向,跳转到登录成功页面
            response.sendRedirect("success.jsp?username=" + URLEncoder.encode(username, "utf-8"));
        } else {
            // 采用重定向,跳转到登录失败页面
            response.sendRedirect("failure.jsp?username=" + URLEncoder.encode(username, "utf-8"));
        }
    }

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

4、创建登录成功页面

  • 登录成功页面 - success.jsp
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
    <head>
        <title>登录成功</title>
    </head>
    <body>
        <h3 style="text-align: center">恭喜,<%=request.getParameter("username")%>,登录成功!</h3>
    </body>
</html>

5、创建登录失败页面

  • 登录失败页面 - failure.jsp
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
    <head>
        <title>登录失败</title>
    </head>
    <body>
        <h3 style="text-align: center">遗憾,<%=request.getParameter("username")%>,登录失败!</h3>
    </body>
</html>

6、编辑项目首页

  • 项目首页 - index.jsp
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
    <head>
        <title>首页</title>
    </head>
    <body>
        <h1 style="color: red; text-align: center">JSP+Servlet方式实现用户登录功能</h1>
        <h3 style="text-align: center"><a href="login.jsp">跳转到登录页面</a></h3>
    </body>
</html>

(三)测试结果

  • 启动服务器,显示首页
    在这里插入图片描述

  • 单击【跳转到登录页面】超链接
    在这里插入图片描述

  • 输入正确的用户名和密码(易烊千玺:001128)

  • 单击【登录】按钮,跳转到登录成功页面
    在这里插入图片描述

  • 返回登录页面,输入错误的用户名或密码

  • 单击【登录】按钮,跳转到登录失败页面
    在这里插入图片描述

三、JSP+Servlet+DB方式实现用户登录功能

(一)实现思路

总体上采用MVC架构。登录页面login.jsp,输入用户名和密码后,跳转到登录处理程序LoginServlet进行业务逻辑处理,调用服务层,服务层调用数据访问层(DAO),连接数据库,查询数据库,以此判断是否登录成功。登录成功,跳转到登录成功页面success.jsp,否则跳转到登录失败页面failure.jsp。
MVC 是 Model、View 和 Controller 的缩写,分别代表 Web 应用程序中的 3 种职责。

(二)实现步骤

1、创建数据库

创建数据库 - test
在这里插入图片描述

  • 单击【确定】按钮

2、创建用户表

创建用户表结构 - t_user
在这里插入图片描述

3、创建Web项目

  • 创建Java Enterprise项目,添加Web Application功能
    在这里插入图片描述

  • 设置项目名与保存位置
    在这里插入图片描述

  • 单击【Finish】按钮

  • 在项目结构窗口里修改Artifact名 - LoginDemo03
    在这里插入图片描述

  • 编辑服务器配置,重新部署项目
    在这里插入图片描述

  • 切换到【Server】选项卡

在这里插入图片描述

4、创建用户实体类

  • 创建net.xyx.bean包,然后在包里创建User类,跟用户表(t_user)对应,简称ORM
    在这里插入图片描述
package net.xyx.bean;

import java.util.Date;

/**
 * 功能:用户实体类
 * 作者:xyx
 * 日期:2023年05月19日
 */
public class User {
    private int id;
    private String username;
    private String password;
    private String telephone;
    private Date registerTime;

    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 getTelephone() {
        return telephone;
    }

    public void setTelephone(String telephone) {
        this.telephone = telephone;
    }

    public Date getRegisterTime() {
        return registerTime;
    }

    public void setRegisterTime(Date registerTime) {
        this.registerTime = registerTime;
    }

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

5、添加数据库驱动程序

  • 在WEB-INF目录下创建lib目录,添加数据库驱动程序
  • 将数据库驱动程序(jar包)作为库添加到项目

在这里插入图片描述

在这里插入图片描述

6、创建数据库连接管理工具类

  • 创建net.xyx.dbutils包,在包里创建ConnectionManager
    在这里插入图片描述
package net.xyx.dbutils;

import javax.swing.*;
import java.sql.Connection;
import java.sql.DriverManager;
import java.sql.SQLException;

/**
 * 功能:数据库连接管理类
 * 作者:xyx
 * 日期:2020年06月05日
 */
public class ConnectionManager {
    private static final String DRIVER = "com.mysql.jdbc.Driver"; // 数据库驱动程序
    private static final String URL = "jdbc:mysql://localhost:3306/student/test?useSSL=false"; // 数据库统一资源标识符
    private static final String USER = "root"; // 数据库用户
    private static final String PASSWORD = "1"; // 数据库密码

    //私有化构造方法,拒绝实例化
    private ConnectionManager() {
    }

    /**
     * 获取数据库连接静态方法
     *
     * @return 数据库连接对象
     */
    public static Connection getConnection() {
        // 定义数据库连接
        Connection conn = null;

        try {
            // 安装数据库驱动程序
            Class.forName(DRIVER);
            // 获取数据库连接
            conn = DriverManager.getConnection(URL, USER, PASSWORD);
        } catch (ClassNotFoundException e) {
            e.printStackTrace();
        } catch (SQLException e) {
            e.printStackTrace();
        }

        // 返回数据库连接
        return conn;
    }

    /**
     * 关闭数据连接静态方法
     *
     * @param conn
     */
    public static void closeConnection(Connection conn) {
        // 判断数据库连接是否非空
        if (conn != null) {
            try {
                // 判断连接是否未关闭
                if (!conn.isClosed()) {
                    // 关闭数据库连接
                    conn.close();
                }
            } catch (SQLException e) {
                e.printStackTrace();
            }
        }
    }

    /**
     * 主方法:测试两个静态方法
     *
     * @param args
     */
    public static void main(String[] args) {
        // 获取数据库连接
        Connection conn = getConnection();
        // 判断数据库连接是否成功
        if (conn != null) {
            JOptionPane.showMessageDialog(null, "恭喜,数据库连接成功!");
        } else {
            JOptionPane.showMessageDialog(null, "遗憾,数据库连接失败!");
        }
        // 关闭数据库连接
        closeConnection(conn);
    }
}

7、创建用户数据访问类

  • 在net.xyx根包里创建dao子包,然后在子包里创建UserDao
package net.xyx.dao;

import net.huawei.bean.User;
import net.huawei.dbutils.ConnectionManager;

import java.sql.Connection;
import java.sql.PreparedStatement;
import java.sql.ResultSet;
import java.sql.SQLException;

/**
 * 功能:用户数据访问类
 * 作者:xyx
 * 日期:2023年05月19日
 */
public class UserDao {
    /**
     * 用户登录方法
     * @param username
     * @param password
     * @return 用户对象(非空:登录成功,否则登录失败)
     */
    public User login(String username, String password) {
        // 声明用户对象
        User user = null;

        // 获取数据库连接
        Connection conn = ConnectionManager.getConnection();
        try {
            // 定义SQL字符串
            String strSQL = "SELECT * FROM t_user WHERE username = ? AND password = ?";
            // 创建预备语句对象
            PreparedStatement pstmt = conn.prepareStatement(strSQL);
            // 设置占位符
            pstmt.setString(1, username);
            pstmt.setString(2, password);
            // 执行查询,返回结果集
            ResultSet rs = pstmt.executeQuery();
            // 判断结果集是否为空
            if (rs.next()) {
                // 创建用户对象
                user = new User();
                // 利用当前记录字段值来设置用户对象属性
                user.setId(rs.getInt("id"));
                user.setUsername(rs.getString("username"));
                user.setPassword(rs.getString("password"));
                user.setTelephone(rs.getString("telephone"));
                user.setRegisterTime(rs.getTimestamp("register_time"));
            }
        } catch (SQLException e) {
            System.err.println(e.getMessage());
        } finally {
            // 关闭数据库连接
            ConnectionManager.closeConnection(conn);
        }

        // 返回用户对象
        return user;
    }
}

8、测试用户数据访问类

  • 在net.xyx根包里创建test子类,在子包里创建TestUser
package net.xyx.test;

import net.xyx.bean.User;
import net.xyx.dao.UserDao;
import org.junit.Test;

/**
 * 功能:测试用户数据访问类
 * 作者:xyx
 * 日期:2023年05月19日
 */
public class TestUserDao {
    @Test
    public void testLogin() {
        String username = "无心剑";
        String password = "12345";

        // 创建用户数据访问对象
        UserDao userDao = new UserDao();
        // 调用登录方法,返回用户对象
        User user = userDao.login(username, password);
        // 判断用户登录是否成功
        if (user != null) { // 成功
            System.out.println("恭喜,用户[" + username + "]登录成功~");
        } else { // 失败
            System.out.println("遗憾,用户[" + username + "]登录失败~");
        }
    }
}

  • 修改用户名和密码,再次运行程序,提示登录失败

四、采用MVC模式实现用户注册功能

1、创建Web项目

  • 创建Java Enterprise项目,添加Web Application功能

在这里插入图片描述

  • 设置项目名与保存位置
    在这里插入图片描述
  • 在项目结构窗口里修改Artifact名 - register
    在这里插入图片描述
  • 编辑服务器配置,重新部署项目
    在这里插入图片描述

2、创建内容

在这里插入图片描述

  • 首页
    在这里插入图片描述
  • 注册界面
    在这里插入图片描述
  • 随后注册成功和失败都会弹出相应的界面

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:/a/789069.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

04_Shell字符串变量

04_Shell字符串 一、字符串拼接&#xff08;推荐双引号&#xff09; 无引号拼接解析变量时不能有空格 单引号拼接无法解析变量 双引号方式可正常解析变量 推荐 二、字符串的长度获取 #!/bin/bash#使用 ${#变量名} 可获取字符串变量长度 var"test" echo "${#va…

[PM]流程与结构设计

流程图 流程就是为了达到特定目标, 进行的一系列有逻辑性的操作步骤, 由两个及已上的步骤, 完成一个完整的行为过程, 即可称为流程, 流程图就是对这个过程的图形化展示 分类 业务流程图 概念: 描述业务流程的一种图, 通过特定符号和连线表示具体某个业务的处理步骤和过程作…

【R语言+Gephi】利用R语言和Gephi实现共发生网络的可视化

【R语言Gephi】利用R语言和Gephi实现共发生网络的可视化 注&#xff1a;本文仅作为自己的学习记录以备以后复习查阅 一 概述 Gephi是一款开源免费的多平台网络分析软件&#xff0c;在Windows、Linux和Mac os上均可以运行&#xff0c;像他们官网所说的&#xff0c;他们致力于…

AWS 云安全性:检测 SSH 暴力攻击

由于开源、低成本、可靠性和灵活性等优势&#xff0c;云基础设施主要由基于linux的机器主导&#xff0c;然而&#xff0c;它们也不能幸免于黑客的攻击&#xff0c;从而影响云的安全性。攻击Linux机器最流行的方法之一是通过SSH通道。 什么是 SSH 安全外壳协议&#xff08;Sec…

二叉树超详细解析

二叉树 目录 二叉树一级目录二级目录三级目录 1.树的介绍1.1树的定义1.2树的基本术语1.3相关性质 2.二叉树介绍2.1定义2.2 性质 3.二叉树的种类3.1 满二叉树3.2完全二叉树3.3 二叉查找树特点&#xff1a;二叉查找树的节点包含的基本信息&#xff1a; 3.4 平衡二叉树 4.二叉树的…

极狐Gitlab安装部署

GitLab 是一个基于 Git 的开源 DevOps 平台&#xff0c;提供代码仓库管理、CI/CD&#xff08;持续集成和持续交付&#xff09;、项目管理、监控和安全等功能。它集成了多种工具&#xff0c;帮助开发团队在一个平台上进行代码开发、测试、部署和运维。以下是 GitLab 的主要功能和…

HippoRAG如何从大脑获取线索以改进LLM检索

知识存储和检索正在成为大型语言模型(LLM)应用的重要组成部分。虽然检索增强生成(RAG)在该领域取得了巨大进步&#xff0c;但一些局限性仍然没有克服。 俄亥俄州立大学和斯坦福大学的研究团队推出了HippoRAG&#xff0c;这是一种创新性的检索框架&#xff0c;其设计理念源于人类…

vue中,图片在div中按照图片原来大小等比例显示

图片在div中按照图片原来大小等比例显示&#xff0c;可以保证web上显示的图片和实际图片形状一样&#xff0c;保留原始图片效果 实现代码如下&#xff1a; <div style"padding: 0; width:400px;height:400px;position: absolute;border: 1px solid #eff2f6;">…

PostgreSQL 中如何实现数据的增量更新和全量更新的平衡?

文章目录 一、增量更新与全量更新的概念增量更新全量更新 二、考虑的因素1. 数据量2. 数据更改的频率和规模3. 数据一致性要求4. 系统性能和资源利用5. 业务逻辑和流程 三、解决方案&#xff08;一&#xff09;混合使用增量更新和全量更新&#xff08;二&#xff09;使用临时表…

制作电子名片的小程序系统源码 快速生成电子名片

在当今数字化时代&#xff0c;传统的纸质名片已逐渐被智能电子名片所取代。电子名片小程序作为一种基于微信生态的创新名片交换方式&#xff0c;凭借其便捷性、高效性和环保性&#xff0c;成为了众多商务人士的首选。小编分享一个制作电子名片的小程序系统源码&#xff0c;无忧…

[Linux]安装+使用虚拟机

首先下载&#xff08;提取码 &#xff1a; ssjf&#xff09;虚拟机&#xff08;应该是必须要下载17的了 &#xff0c; 我刚开始下载了15,16的在解决了不兼容的问题后频繁出现蓝屏的 &#xff09; 刚开始我遇见了 小问题 --》 在查看了以下两篇blog就解决了 虚拟机无法打开,…

几行代码,优雅的避免接口重复请求!同事都说好!

往期精彩文章&#xff1a;拿客户电脑&#xff0c;半小时完成轮播组件开发&#xff01;被公司奖励500&#xff01; 背景简介 我们日常开发中&#xff0c;经常会遇到点击一个按钮或者进行搜索时&#xff0c;请求接口的需求。 如果我们不做优化&#xff0c;连续点击按钮或者进行…

java使用poi-tl模版引擎导出word之列表循环数据渲染

目录 1.模版制作2.开启spring表达式3.编写关键代码接口4. 导出结果 poi-tl模版引擎中&#xff0c;如果区块对的值是一个非空集合&#xff0c;区块中的文档元素会被迭代渲染一次或者N次&#xff0c;这取决于集合的大小&#xff0c;类似于foreach语法。 1.模版制作 在静态资源目…

Mac VSCode 突然闪退、崩溃、打不开了

1、 思路历程 VSCode 作为前端常用开发工具&#xff0c;其重要性就不一一描述了。 所以 VSCode 突然打不开了&#xff0c;真的是让我一脸懵逼。 本来以为问题不大&#xff0c;于是 &#xff1a; 1、重启了一下VSCode 2、关机重启了一下电脑&#xff1b; 3、清理了一下缓存&am…

体积大的快递怎么寄便宜?如何寄件寄包裹更省钱?

大学毕业了&#xff0c;面对即将到来的工作生活&#xff0c;小李不得不把宿舍里的大包小包打包寄回家。可是&#xff0c;当他真正开始打包行李时&#xff0c;才发现这可不是一件简单的事&#xff1a;衣服、被子、书籍、杂物……这些东西加起来体积不小&#xff0c;想要省钱寄快…

网络安全设备——探针

网络安全设备探针是一种专门用于网络安全领域的工具&#xff0c;它通过对网络流量进行监控和分析&#xff0c;帮助发现和防止网络攻击。以下是对网络安全设备探针的详细解释&#xff1a; 定义与功能 定义&#xff1a;网络安全设备探针是一种设备或软件&#xff0c;它通过捕获…

3年经验的B端产品经理,应该是什么水平?

问你一个问题&#xff1a;你觉得3年经验的B端产品经理&#xff0c;应该是什么水平&#xff1f;很多朋友可能也没有仔细想过&#xff0c;自己3年后应该达到一个什么水平&#xff1f;能做什么体量的业务&#xff1f;要能拿多少薪资&#xff1f; 前几天和一个B端产品经理聊天&…

突破AI性能瓶颈 揭秘LLaMA-MoE模型的高效分配策略

获取本文论文原文PDF&#xff0c;请在公众号【AI论文解读】留言&#xff1a;论文解读 本文介绍了一种名为“LLaMA-MoE”的方法&#xff0c;通过将现有的大型语言模型&#xff08;LLMs&#xff09;转化为混合专家网络&#xff08;MoE&#xff09;&#xff0c;从而解决了训练MoE…

一个项目学习Vue3---Vue3中自带的事件

1. .stop 阻止事件继续传播&#xff0c;即防止事件冒泡到父元素。 <div click.stop"handleClick">点击我</div> 2. .prevent 阻止事件的默认行为&#xff0c;比如阻止表单提交时的页面刷新。 <form submit.prevent"handleSubmit">阻…

提升困难生学工支持:智慧校园的新功能介绍

智慧校园的学工管理系统内嵌的困难生信息管理功能&#xff0c;是一个综合性的服务平台&#xff0c;专注于精准识别校园内的经济困难学生&#xff0c;并给予他们必要的帮助与关怀&#xff0c;确保每位学生都能在公平的环境中追求学业和个人成长。这一功能通过一系列信息化手段&a…