其他分享
首页 > 其他分享> > 简单易学的SSM三大框架(Spring+SpringMVC+MyBatis),要求使用Ajax异步技术整合,你学废了么?

简单易学的SSM三大框架(Spring+SpringMVC+MyBatis),要求使用Ajax异步技术整合,你学废了么?

作者:互联网

目录

Ⅰ、SSM 框架简介

一、什么是Spring

1、控制反转(IOC)是什么?

2、面向切面(AOP)是什么?

二、什么是SpringMVC

1、什么是MVC?

三、MyBatis的作用

Ⅱ、数据库

(员工表,无主/外键关联)在这里插入图片描述
(身份表,无主/外键关联)在这里插入图片描述

Ⅲ、代码实测

一、实测工具

IDEA 2020.3.3
MySQL
maven 3.3.9
Tomcat 9.0.46

二、项目实测即源码

:本项目只是以学习为目的,并非真实项目需求,往往会存在部分Bug。
源码下载地址:https://pan.baidu.com/s/1eD3Q1Z7p5N6IC4eiQRZ3iQ
提取码:1024

1、创建Maven项目
创建Maven项目
2、点击Maven,再勾选"Create from archetype"选项,再选中“… : maven-archetype-webapp”的结构,再点击“Next”下一步。创建Maven项目1
3、输入项目名称(ssmDemo),以及选择项目储存路径,第3步选填。创建Maven项目2

4、点击选择Maven下载的路径。创建Maven项目3
5、勾选“Override”,再点击左侧的文件夹图标选择maven的“settings.xml”。创建Maven项目4
6、勾选“Override”,再点击左侧的文件夹图标选择maven依赖仓库储存的文件夹。(注:可自定义maven依赖仓库)。创建Maven项目5

7、整体如图。
创建Maven项目6

8、如果IDEA左下角出现这个情况,则需等待一会儿,部分依赖下载中…。
创建Maven项目7

9、下载完成后文件目录结构如下图所示。(注:也可以在java原项目添加web项目,这里不做演示)
创建Maven项目8
10、ssm框架的整体目录结构如下图。(注:需自行创建文件夹)整体结构
11、再点击“pom.xml”把黄色方框里的代码替换成下面这些依赖jar包
在这里插入图片描述
替换以下依赖

<properties>
    <spring.version>4.2.6.RELEASE</spring.version>
    <mybatis.version>3.2.8</mybatis.version>
    <mybatis-spring.version>1.2.2</mybatis-spring.version>
    <servlet.version>3.0.1</servlet.version>
    <druid.version>1.0.13</druid.version>
    <jsp-api.version>2.1</jsp-api.version>
    <jstl.version>1.2</jstl.version>
    <mysql.connector.version>5.1.38</mysql.connector.version>
    <aspectj.version>1.8.6</aspectj.version>
    <commons.fileupload.version>1.3.1</commons.fileupload.version>
    <jackson.version>2.5.4</jackson.version>
    <log4j.version>1.2.17</log4j.version>
    <slf4j.version>1.7.7</slf4j.version>
  </properties>

  <dependencies>
    <dependency>
      <groupId>junit</groupId>
      <artifactId>junit</artifactId>
      <version>3.8.1</version>
      <scope>test</scope>
    </dependency>
    <dependency>
      <groupId>com.alibaba</groupId>
      <artifactId>fastjson</artifactId>
      <version>1.2.75</version>
    </dependency>
    <dependency>
      <groupId>org.springframework</groupId>
      <artifactId>spring-core</artifactId>
      <version>${spring.version}</version>
    </dependency>
    <dependency>
      <groupId>org.springframework</groupId>
      <artifactId>spring-context</artifactId>
      <version>${spring.version}</version>
      <type>jar</type>
    </dependency>
    <dependency>
      <groupId>org.springframework</groupId>
      <artifactId>spring-webmvc</artifactId>
      <version>${spring.version}</version>
    </dependency>
    <dependency>
      <groupId>org.springframework</groupId>
      <artifactId>spring-jdbc</artifactId>
      <version>${spring.version}</version>
    </dependency>
    <dependency>
      <groupId>org.springframework</groupId>
      <artifactId>spring-aop</artifactId>
      <version>${spring.version}</version>
    </dependency>
    <dependency>
      <groupId>org.springframework</groupId>
      <artifactId>spring-web</artifactId>
      <version>${spring.version}</version>
    </dependency>
    <dependency>
      <groupId>org.springframework</groupId>
      <artifactId>spring-orm</artifactId>
      <version>${spring.version}</version>
    </dependency>
    <dependency>
      <groupId>org.mybatis</groupId>
      <artifactId>mybatis</artifactId>
      <version>${mybatis.version}</version>
    </dependency>
    <dependency>
      <groupId>org.mybatis</groupId>
      <artifactId>mybatis-spring</artifactId>
      <version>${mybatis-spring.version}</version>
    </dependency>
    <dependency>
      <groupId>org.springframework</groupId>
      <artifactId>spring-beans</artifactId>
      <version>${spring.version}</version>
    </dependency>
    <dependency>
      <groupId>org.aspectj</groupId>
      <artifactId>aspectjweaver</artifactId>
      <version>${aspectj.version}</version>
    </dependency>
    <dependency>
      <groupId>commons-fileupload</groupId>
      <artifactId>commons-fileupload</artifactId>
      <version>${commons.fileupload.version}</version>
    </dependency>
    <dependency>
      <groupId>com.fasterxml.jackson.core</groupId>
      <artifactId>jackson-core</artifactId>
      <version>${jackson.version}</version>
    </dependency>
    <dependency>
      <groupId>com.fasterxml.jackson.core</groupId>
      <artifactId>jackson-databind</artifactId>
      <version>${jackson.version}</version>
    </dependency>
    <dependency>
      <groupId>javax.servlet</groupId>
      <artifactId>javax.servlet-api</artifactId>
      <version>${servlet.version}</version>
      <scope>provided</scope>
    </dependency>
    <dependency>
      <groupId>javax.servlet.jsp</groupId>
      <artifactId>jsp-api</artifactId>
      <version>${jsp-api.version}</version>
      <scope>provided</scope>
    </dependency>
    <dependency>
      <groupId>javax.servlet</groupId>
      <artifactId>jstl</artifactId>
      <version>${jstl.version}</version>
    </dependency>
    <dependency>
      <groupId>com.alibaba</groupId>
      <artifactId>druid</artifactId>
      <version>${druid.version}</version>
    </dependency>
    <dependency>
      <groupId>mysql</groupId>
      <artifactId>mysql-connector-java</artifactId>
      <version>${mysql.connector.version}</version>
    </dependency>
    <dependency>
      <groupId>log4j</groupId>
      <artifactId>log4j</artifactId>
      <version>${log4j.version}</version>
    </dependency>
    <dependency>
      <groupId>org.slf4j</groupId>
      <artifactId>slf4j-api</artifactId>
      <version>${slf4j.version}</version>
    </dependency>
    <dependency>
      <groupId>org.slf4j</groupId>
      <artifactId>slf4j-log4j12</artifactId>
      <version>${slf4j.version}</version>
    </dependency>
  </dependencies>

12、添加Tomcat
IDEA配置Tomcat【点击】
在这里插入图片描述

xml文件配置

applicationContext.xml(Spring核心配置xml)

<?xml version="1.0" encoding="UTF-8"?>
<beans xmlns="http://www.springframework.org/schema/beans"
       xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
       xmlns:context="http://www.springframework.org/schema/context"
       xsi:schemaLocation="http://www.springframework.org/schema/beans
       http://www.springframework.org/schema/beans/spring-beans.xsd
        http://www.springframework.org/schema/context
        http://www.springframework.org/schema/context/spring-context.xsd

">

    <!--    扫描注解包-->
    <context:component-scan base-package="com.ChenZhiHui.Mapper"></context:component-scan>
    <context:component-scan base-package="com.ChenZhiHui.Service"></context:component-scan>

    <!-- 读取数据库配置文件 -->
    <context:property-placeholder location="classpath:db.MySQL.properties"/>

    <!-- JNDI获取数据源(使用dbcp连接池) -->
    <bean id="dataSource"
          class="com.alibaba.druid.pool.DruidDataSource" destroy-method="close" scope="singleton">
        <property name="driverClassName" value="${jdbc.driver}" />
        <property name="url" value="${jdbc.url}" />

        <property name="username" value="${jdbc.username}" />
        <property name="password" value="${jdbc.password}" />
    </bean>

    <!--Mapper扫描仪-->
    <!--他能自动给Mapper下的接口生成一个首字母小写的对象-->
    <bean class="org.mybatis.spring.mapper.MapperScannerConfigurer">
        <property name="basePackage" value="com.ChenZhiHui.Mapper"/>
    </bean>

    <!-- 配置mybitas SqlSessionFactoryBean-->
    <bean id="sqlSessionFactory" class="org.mybatis.spring.SqlSessionFactoryBean">
        <property name="dataSource" ref="dataSource"/>
        <property name="configLocation" value="classpath:mybatis-config.xml"/>
    </bean>


</beans>

db.MySQL.properties(数据库配置文件)

jdbc.driver=com.mysql.jdbc.Driver
jdbc.url=jdbc:mysql://127.0.0.1:3306/company?useSSL=false&useUnicode=true&characterEncoding=utf8&serverTimezone=Asia/Shanghai
jdbc.username=root
jdbc.password=root

mybatis-config.xml(MyBatis核心配置xml)

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE configuration
        PUBLIC "-//mybatis.org//DTD Config 3.0//EN"
        "http://mybatis.org/dtd/mybatis-3-config.dtd">
<configuration>
    <!--日志输出-->
    <settings>
        <setting name="logImpl" value="stdout_logging" />
    </settings>
    <!--别名-->
    <typeAliases>
        <package name="com.ChenZhiHui"/>
    </typeAliases>

</configuration>

springmvc-servlet.xml(SpringMVC核心配置xml)

<?xml version="1.0" encoding="UTF-8"?>
<beans xmlns="http://www.springframework.org/schema/beans"
       xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
       xmlns:mvc="http://www.springframework.org/schema/mvc"
       xmlns:context="http://www.springframework.org/schema/context"
       xsi:schemaLocation="
        http://www.springframework.org/schema/beans
        http://www.springframework.org/schema/beans/spring-beans.xsd
        http://www.springframework.org/schema/context
        http://www.springframework.org/schema/context/spring-context.xsd
        http://www.springframework.org/schema/mvc
        http://www.springframework.org/schema/mvc/spring-mvc.xsd">

        <!--	支持注解-->
        <mvc:annotation-driven></mvc:annotation-driven>

        <!--	
        扫描注解包,指向Controller包
		例:base-package="com.XXX.Controller
		-->
        <context:component-scan base-package="com.ChenZhiHui.Controller"></context:component-scan>

        <!--    加载静态资源-->
        <mvc:default-servlet-handler></mvc:default-servlet-handler>

</beans>

web.xml

<!DOCTYPE web-app PUBLIC
 "-//Sun Microsystems, Inc.//DTD Web Application 2.3//EN"
 "http://java.sun.com/dtd/web-app_2_3.dtd" >

<web-app>
  <display-name>Archetype Created Web Application</display-name>
  
  <context-param>
    <param-name>contextConfigLocation</param-name>
    <param-value>classpath:applicationContext.xml</param-value>
  </context-param>
  
  <filter>
    <filter-name>encoding</filter-name>
    <filter-class>org.springframework.web.filter.CharacterEncodingFilter</filter-class>
    <init-param>
      <param-name>encoding</param-name>
      <param-value>utf-8</param-value>
    </init-param>
  </filter>

<!--加载过滤器-->
  <filter>
    <filter-name>my</filter-name>
    <filter-class>com.ChenZhiHui.Filter.FirstFilter</filter-class>
  </filter>
  <filter-mapping>
    <filter-name>my</filter-name>
    <url-pattern>/*</url-pattern>
  </filter-mapping>
  
  <filter-mapping>
    <filter-name>encoding</filter-name>
    <url-pattern>/*</url-pattern>
  </filter-mapping>


  <listener>
    <listener-class>org.springframework.web.context.ContextLoaderListener</listener-class>
  </listener>

  <servlet>
    <servlet-name>springmvc</servlet-name>
    <servlet-class>org.springframework.web.servlet.DispatcherServlet</servlet-class>
    <init-param>
      <param-name>contextConfigLocation</param-name>
      <param-value>classpath:springmvc-servlet.xml</param-value>
    </init-param>
    <load-on-startup>1</load-on-startup>
  </servlet>

  <servlet-mapping>
    <servlet-name>springmvc</servlet-name>
    <url-pattern>/</url-pattern>
  </servlet-mapping>

<!--默认加载页面-->
  <welcome-file-list>
    <welcome-file>login.jsp</welcome-file>
  </welcome-file-list>

</web-app>

companyMapper.xml(Mapper核心配置xml)

<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE mapper PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN"
        "http://mybatis.org/dtd/mybatis-3-mapper.dtd">
<!--namespace指向Mapper层接口-->
<mapper namespace="com.ChenZhiHui.Mapper.companyMapper">

        <!--创建一个Map集合-->
        <resultMap id="dologinMap" type="companyPage">
            <id column="cid" property="cid"></id>
            <result column="cnumber" property="cnumber"></result>
            <result column="cpwd" property="cpwd"></result>
            <result column="cname" property="cname"></result>
            <result column="iid" property="iid"></result>
            <association property="identityPage" javaType="com.ChenZhiHui.Page.identityPage">
                <id column="iid" property="iid"></id>
                <result column="iidentity" property="iidentity"></result>
            </association>
        </resultMap>

<!--登录SQL-->
    <select id="dologin" resultMap="dologinMap" parameterType="companyPage">
        SELECT * FROM company WHERE cnumber=#{cnumber} AND cpwd=#{cpwd}
    </select>
<!--主页查询SQL-->
    <select id="pageSelect" resultMap="dologinMap">
        SELECT * FROM company AS c,identity AS i WHERE c.iid=i.iid AND c.cname LIKE CONCAT('%',#{text},'%') AND c.iid=i.iid
        <if test="uid!=-1">
            AND c.iid=#{uid}
        </if>
        LIMIT #{index},#{sum}
    </select>
<!--主页删除SQL-->
    <delete id="pageDelete" parameterType="int">
        DELETE FROM company WHERE cid=#{cid}
    </delete>
<!--查询总页数SQL-->
    <select id="pageNumber" resultType="int">
        SELECT COUNT(0) FROM company
    </select>
<!--主页修改SQL-->
    <update id="pageUpdate" parameterType="companyPage">
        UPDATE company SET cpwd=#{cpwd},cname=#{cname},iid=#{iid} WHERE cid=#{cid}
    </update>
<!--注册用户SQL-->
    <insert id="logon" parameterType="companyPage">
        INSERT INTO company(cnumber,cpwd,cname,iid) VALUES (#{cnumber},#{cpwd},#{cname},0)
    </insert>
</mapper>

三、各个类代码

companyController(Controller类)

package com.ChenZhiHui.Controller;

import com.ChenZhiHui.Page.companyPage;
import com.alibaba.fastjson.JSON;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import com.ChenZhiHui.Service.companyService;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.ResponseBody;

import javax.servlet.http.HttpServletRequest;
import java.util.List;

@Controller
public class companyController {

    @Autowired
    companyService companyService;

    /**
     * 登录
     * @param companyPage
     * @param request
     * @return
     */
    @RequestMapping(value="/dologin")
    public String doLogin(companyPage companyPage, HttpServletRequest request){
        companyPage companyPage1=companyService.dologin(companyPage);
        if(companyPage1!=null){
            request.getSession().setAttribute("cid",companyPage1.getCid());
            request.getSession().setAttribute("cnumber",companyPage1.getCnumber());
            request.getSession().setAttribute("cpwd",companyPage1.getCpwd());
            request.getSession().setAttribute("cname",companyPage1.getCname());
            request.getSession().setAttribute("iid",companyPage1.getIdentityPage().getIid());
            if(companyPage1.getIdentityPage().getIid()==1){
                return "redirect:page.jsp?cidentity=1";
            }else{
                return "redirect:page.jsp?cidentity=0";
            }
        }else {
            return "redirect:login.jsp?cidentity=-1";
        }
    }

    /**
     * 查询总页数
     * @param sum
     * @return
     */
    @RequestMapping("/pageNumber")
    @ResponseBody
    public String pageNumber(int sum){
        String str=null;
        System.out.println("sum="+sum);
            int count=companyService.pageNumber();
            count=count%sum==0?count/sum:count/sum+1;
            str= JSON.toJSONString(count);
            return str;
    }

    /**
     * 主页查询
     * produces = "text/plain;charset=utf-8":设置编码
     * @param index
     * @param sum
     * @param text
     * @param uid
     * @return
     */
    @RequestMapping(value = "/pageSelect",produces = "text/plain;charset=utf-8")
    @ResponseBody
    public String pageSelect(int index,int sum,String text,int uid){
        List<companyPage> companyList=companyService.pageSelect(index,sum,text,uid);
        String str=JSON.toJSONString(companyList);
        return str;
    }

    /**
     * 主页删除
     * @param cid
     * @return
     */
    @RequestMapping("/pageDelete")
    @ResponseBody
    public String pageDelete(int cid){
        System.out.println(cid);
        int count=companyService.pageDelete(cid);
        String str=JSON.toJSONString(count);
        System.out.println("str="+str);
        return str;
    }

    /**
     * 主页修改
     * produces = "text/plain;charset=utf-8":设置编码
     * @param companyPage
     * @return
     */
    @RequestMapping(value = "/pageUpdate",produces = "text/plain;charset=utf-8")
    public String pageUpdate(companyPage companyPage){
        int count=companyService.pageUpdate(companyPage);
        return "page.jsp";
    }

    /**
     * 注册
     * produces = "text/plain;charset=utf-8":设置编码
     * @param companyPage
     * @param request
     * @return
     */
    @RequestMapping( value = "/logon",produces = "text/plain;charset=utf-8")
    public String logon(companyPage companyPage,HttpServletRequest request){
        request.getSession().setAttribute("cnumber",companyPage.getCnumber());
        int count=companyService.logon(companyPage);
        return "redirect:page.jsp";
    }
}

FirstFilter(过滤器)

package com.ChenZhiHui.Filter;

import javax.servlet.*;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;

public class FirstFilter implements Filter {
    //过滤器的初始化
    public void init(FilterConfig filterConfig) throws ServletException {

    }

    public void doFilter(ServletRequest servletRequest, ServletResponse servletResponse, FilterChain filterChain) throws IOException, ServletException {

        HttpServletRequest request=(HttpServletRequest)servletRequest;
        HttpServletResponse response=(HttpServletResponse)servletResponse;
        String url=request.getRequestURI();
        //允许带login(登录)、logon(注册)页面加载,允许*.js静态资源加载
        if(request.getSession().getAttribute("cnumber")!=null || url.contains("login") || url.contains("logon") || url.contains("*.js")) {
            filterChain.doFilter(servletRequest,servletResponse);
        }else{
            //返回登录
            response.sendRedirect("login.jsp");
        }
    }

    //过滤器销毁
    public void destroy() {

    }
}

companyMapper(Mapper接口)

package com.ChenZhiHui.Mapper;

import com.ChenZhiHui.Page.companyPage;
import org.apache.ibatis.annotations.Param;

import java.util.List;

public interface companyMapper {
    companyPage dologin(companyPage companyPage);       //登录
    int pageNumber();           //查询总条数
    //index当前页数,sum显示几条信息,text查询的名字,uid是不是查询全部/员工/管理员(-1=查全部,0=查员工,1=查管理员)
    List<companyPage> pageSelect(@Param("index") int index, @Param("sum") int sum, @Param("text") String text,@Param("uid") int uid);         //查询全部员工
    int pageDelete(@Param("cid") int cid);        //删除
    int pageUpdate(companyPage companyPage);    //修改
    int logon(companyPage companyPage);    //注册
}

companyPage(员工Page实体类)

package com.ChenZhiHui.Page;

public class companyPage {
    private Integer cid;        //序号
    private String cnumber;     //账号
    private String cpwd;        //密码
    private String cname;       //姓名
    private Integer iid;  //身份
    private identityPage identityPage;      //身份类对象

    public Integer getCid() {
        return cid;
    }

    public void setCid(Integer cid) {
        this.cid = cid;
    }

    public String getCnumber() {
        return cnumber;
    }

    public void setCnumber(String cnumber) {
        this.cnumber = cnumber;
    }

    public String getCpwd() {
        return cpwd;
    }

    public void setCpwd(String cpwd) {
        this.cpwd = cpwd;
    }

    public String getCname() {
        return cname;
    }

    public void setCname(String cname) {
        this.cname = cname;
    }

    public Integer getIid() {
        return iid;
    }

    public void setIid(Integer iid) {
        this.iid = iid;
    }

    public com.ChenZhiHui.Page.identityPage getIdentityPage() {
        return identityPage;
    }

    public void setIdentityPage(com.ChenZhiHui.Page.identityPage identityPage) {
        this.identityPage = identityPage;
    }
}

identityPage(人员身份Page实体类)

package com.ChenZhiHui.Page;

import java.util.List;

public class identityPage {
    private Integer iid;        //序号
    private String iidentity;  //身份
    private List<companyPage> companyPageList;      //员工类集合

    public Integer getIid() {
        return iid;
    }

    public void setIid(Integer iid) {
        this.iid = iid;
    }

    public String getIidentity() {
        return iidentity;
    }

    public void setIidentity(String iidentity) {
        this.iidentity = iidentity;
    }

    public List<companyPage> getCompanyPageList() {
        return companyPageList;
    }

    public void setCompanyPageList(List<companyPage> companyPageList) {
        this.companyPageList = companyPageList;
    }
}

companyServiceImpl(Service接口实现类)

package com.ChenZhiHui.Service.Impl;

import com.ChenZhiHui.Page.companyPage;
import com.ChenZhiHui.Service.companyService;
import org.springframework.beans.factory.annotation.Autowired;
import com.ChenZhiHui.Mapper.companyMapper;
import org.springframework.stereotype.Service;

import java.util.List;
@Service
public class companyServiceImpl implements companyService {

    @Autowired
    companyMapper companyMapper;

    //登录
    public companyPage dologin(companyPage companyPage) {
        return companyMapper.dologin(companyPage);
    }

    //查询总条数
    public int pageNumber() {

        return companyMapper.pageNumber();
    }

    //查询全部员工
    public List<companyPage> pageSelect(int index, int sum, String text,int uid) {

        return companyMapper.pageSelect(index,sum,text,uid);
    }

    //删除
    public int pageDelete(int cid) {

        return companyMapper.pageDelete(cid);
    }

    //修改
    public int pageUpdate(companyPage companyPage) {

        return companyMapper.pageUpdate(companyPage);
    }

    //注册
    public int logon(companyPage companyPage) {
        return companyMapper.logon(companyPage);
    }
}

companyService(Service接口)

package com.ChenZhiHui.Service;

import com.ChenZhiHui.Page.companyPage;
import org.apache.ibatis.annotations.Param;
import org.springframework.stereotype.Service;

import java.util.List;


public interface companyService {
    companyPage dologin(companyPage companyPage);       //登录
    int pageNumber();           //查询总条数
    List<companyPage> pageSelect(int index,int sum,String text,int uid);     //查询全部员工
    int pageDelete(int cid);        //删除
    int pageUpdate(companyPage companyPage);    //修改
    int logon(companyPage companyPage);    //注册
}

login.jsp(登录页面)

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>登录</title>
    <script src="js/jquery-1.12.4.js"></script>
</head>
<body>
<h2>Hello World!</h2>
<form action="dologin" method="post">
    账号:<input type="text" name="cnumber">
    密码:<input type="text" name="cpwd">
    <input type="submit" value="登录">
    <input type="button" onclick="logon();" value="注册">
</form>
</body>
</html>
<script type="text/javascript">
    var iidentity=0;        //登录结果
    $(function (){
        //获取“=”号后面的第一个值,
        iidentity=window.location.href.split("=")[1];
        login();
    });
    //前往注册页面
    function logon(){
        window.location.href="logon.jsp";
    }
    //返回登录结果
    function login(){
        if(iidentity==-1){
            alert("账号或密码错误!");
        }
    }
</script>

logon.jsp(注册页面)

<%@ page pageEncoding="utf-8" %>
<html>
<head>
    <title>注册</title>
    <script src="js/jquery-1.12.4.js"></script>
</head>
<body>
<h2>用户注册</h2>
<form action="logon" method="post">
    账号:<input type="text" name="cnumber" placeholder="手机号/邮箱"/></br>
    密码:<input type="text" name="cpwd"/></br>
    姓名:<input type="text" name="cname"/>
    </br>
    <input type="submit" value="注册"><input type="button" id="goBack" value="返回登录">
</form>
</body>
</html>
<script type="text/javascript">
    $(function (){
        $("input[name='cnumber']").focus();        //自动获取焦点
    });
</script>

page.jsp(主页)

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>首页</title>
    <script src="js/jquery-1.12.4.js"></script>
</head>
<body>
<input type="text" id="text" name="select" placeholder="请输入要查找的名字">&nbsp;&nbsp;<input type="radio" name="identity" value="-1" checked="true">全部&nbsp;&nbsp;<input type="radio" name="identity" value="0">员工&nbsp;&nbsp;<input type="radio" name="identity" value="1">管理员<input type="button" onclick="pageSelect()" value="查询"/>
<table border="1" id="showSelect">
    <tr><td>序号</td><td>账号</td><td>密码</td><td>姓名</td><td>身份</td><td colspan="2">操作</td></tr>
</table>
<div id="counter">
    <button id="shouye" type="button" onclick="shouye()">首页</button>
    <button id="shangyiye" type="button" onclick="shangyiye()">上一页</button>
    <button id="xiayiye" type="button" onclick="xiayiye()">下一页</button>
    <button id="weiye" type="button" onclick="weiye()">尾页</button>
    <b id="number">页数:x/y</b>
</div>
<form id="modification" action="pageUpdate" method="post">
    序号:<input type="text" name="cid" readonly="readonly"/>
    账号:<input type="text" name="cnumber" readonly="readonly"/>
    密码:<input type="text" name="cpwd">
    姓名:<input type="text" name="cname">
    身份:<input type="radio" name="iid" value="0">员工&nbsp;&nbsp;<input type="radio" name="iid" value="1">管理员
    <input type="submit" onsubmit="pageSubmit()" value="保存">
</form>
</body>
</html>
<script type="text/javascript">
    var iidentity=0;    //身份
    var index=1;        //当前页数
    var sum=4;          //显示行数
    var count=0;        //总行数
    var uid=-1;         //按身份查询;-1=全部,0=员工,1=管理员

    $(function (){
        //获取身份
        iidentity=window.location.href.split("=")[1];
        //页面加载掩藏修改框
        $("#modification").hide();
        //查询总页数和更新页码
        pageNumber();
        //查询全部人员
        pageSelect();
    });
    //保存修改自动掩藏修改框
    function pageSubmit(){
        $("#modification").hide();
    }

    //主页查询
    function pageSelect(){
        //获取身份
        var a=document.getElementsByName("identity");
        for(var i=0;i<a.length;i++){
            if(a[i].checked){
               uid=a[i].value;
            }
        }
        //更新页数
        pageNumber();
        var text=$("#text").val();
        $("table tr:gt(0)").remove();
        // alert((index-1)*sum+":"+text+":"+uid);
        $.post("pageSelect",{"index":(index-1)*sum,"sum":sum,"text":text,"uid":uid},function (data){
            if(data!=""){
            var str="<tr>";
                for (var i=0;i<data.length;i++) {
                    str += "<td>"+data[i].cid+"</td><td>"+data[i].cnumber+"</td><td>"+data[i].cpwd+"</td><td>"+data[i].cname+"</td><td>"+data[i].identityPage.iidentity+"<td>";
                    if (iidentity==0) {
                        str += "<input type='button' disabled='disabled' value='删除'/><input type='button' disabled='disabled' value='修改'/>";
                    } else {
                        str += "<input type='button' οnclick='pageDelete(" + data[i].cid + ");' value='删除'/>" +
                            "<input type='button' οnclick='pageUpdate("+data[i].cid+",\""+data[i].cnumber+"\","+data[i].cpwd+",\""+data[i].cname+"\","+data[i].iid+");' value='修改'/>";
                    }
                    str+="</td></tr>";
                }
                $("#showSelect").append($(str));
            }else{
                index--;
                if(index<1){
                    index=1;
                }
                //续查
                pageSelect();
            }
        },"JSON");
    }
    //修改方法
    function pageUpdate(cid,cnumber,cpwd,cname,iid){
        $("#modification").show();
        alert(cid+":"+cnumber+":"+cpwd+":"+cname+":"+iid);
        $("input[name='cid']").val(cid);
        $("input[name='cnumber']").val(cnumber);
        $("input[name='cpwd']").val(cpwd);
        $("input[name='cname']").val(cname);
        $("#modification input[type='radio']").eq(iid).prop("checked",true);
    }
    //删除方法
    function pageDelete(cid){
        $.post("pageDelete",{"cid":cid},function (data){
            console.log(data);
            if(data>0){
                console.log("删除成功!");
                pageSelect();
            }else{
                console.log("删除失败!");
            }
        },"JSON");
    }
    //首页
    function shouye(){
        index=1;
        pageSelect();
    }
    //上一页
    function shangyiye(){
        index--;
        if(index<1){
            index=1;
        }
        pageSelect();
    }
    //下一页
    function xiayiye(){
        index++;
        if(index>count){
            index=count;
        }
        pageSelect();
    }
    //尾页
    function weiye(){
        index=count;
        pageSelect();
    }
    //更新页数
    function pageNumber(){
        $.post("pageNumber",{"sum":sum},function(data){
            count=data;
            $("#number").empty();
            var str="页数:"+index+"/"+count;
            $("#number").append(str);
        },"JSON");
    }
</script>

标签:你学,cid,SpringMVC,Spring,companyPage,int,import,return,public
来源: https://blog.csdn.net/weixin_46379270/article/details/117756608