SSM学习_登录/验证码

最新推荐文章于 2021-02-15 19:58:47 发布

1024。

最新推荐文章于 2021-02-15 19:58:47 发布

阅读量539

点赞数

分类专栏：学习文章标签： java

本文链接：https://blog.csdn.net/qq_41460185/article/details/105588053

版权

本文档介绍了在SSM项目中如何实现登录界面，包括利用EasyUI进行图片上传。重点讲解了验证码的生成过程，从生成源码、控制器调用到前端页面的显示，提供了一种在BaseProjectSSM项目中实现登录验证的方法。

摘要由CSDN通过智能技术生成

登录界面以及利用easyui实现的图片上传

项目：BaseProjectSSM

登录页面

BaseProjectSSM中的demo.jsp中有个不错的模板
注意：
引入css 两个和 js 三个，
而且注意div的属性 id=“particles-js” class=“login” style=“display: block;” 等等

还有学习到了传值及取值：${名称}

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>Demo</title>
    <meta name="description" content="particles.js is a lightweight JavaScript library for creating particles.">
    <meta name="author" content="Vincent Garreau">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
    <link rel="stylesheet" media="screen" href="../resources/admin/login/css/style.css">
    <link rel="stylesheet" type="text/css" href="../resources/admin/login/css/reset.css">
</head>
<body>
<%--其中id就是动态图片的样式--%>
<%--<div id="particles-js">--%>
<%--    <div class="login" style="display: block;" >--%>
<%--        Hello World ! ${
   name}--%>
<%--    </div>--%>
<%--</div>--%>


    <div id="particles-js">
        <div class="login" style="display: block;">
            <div class="login-top">
                登录
            </div>
            <div class="login-center clearfix">
                <div class="login-center-img"><img src="../resources/admin/login/images/name.png"></div>
                <div class="login-center-input">
                    <input type="text" name="username" id="username" value="" placeholder="请输入您的用户名" onfocus="this.placeholder=&#39;&#39;" onblur="this.placeholder=&#39;请输入您的用户名&#39;">
                    <div class="login-center-input-text">用户名</div>
                </div>
            </div>
            <div class="login-center clearfix">
                <div class="login-center-img"><img src="../resources/admin/login/images/password.png"></div>
                <div class="login-center-input">
                    <input type="password" name="password" id="password" value="" placeholder="请输入您的密码" onfocus="this.placeholder=&#39;&#39;" onblur="this.placeholder=&#39;请输入您的密码&#39;">
                    <div class="login-center-input-text">密码</div>
                </div>
            </div>
            <div class="login-center clearfix">
                <div class="login-center-img"><img src="../resources/admin/login/images/cpacha.png"></div>
                <div class="login-center-input">
                    <input style="width:50%;" type="text" name="cpacha" id="cpacha" value="" placeholder="请输入验证码" onfocus="this.placeholder=&#39;&#39;" onblur="this.placeholder=&#39;请输入验证码&#39;">
                    <div class="login-center-input-text">验证码</div>
                    <img id="cpacha-img" title="点击切换验证码" style="cursor:pointer;" src="get_cpacha?vl=4&w=150&h=40&type=loginCpacha" width="110px" height="30px"</