SpringMVC之前端增删改查实现

SpringMVC是一个基于MVC架构的框架，它可以帮助我们实现前后端的分离，同时也能很好地支持前端的增删改查操作。

配置

Cloudjun

<?xml version="1.0" encoding="UTF-8" ?><taglib xmlns="http://java.sun.com/xml/ns/j2ee"xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"xsi:schemaLocation="http://java.sun.com/xml/ns/j2ee http://java.sun.com/xml/ns/j2ee/web-jsptaglibrary_2_0.xsd"version="2.0"><description>CloudJun 1.1 core library</description><display-name>CloudJun core</display-name><tlib-version>1.1</tlib-version><short-name>CloudJun</short-name><uri>http://jsp.veryedu.cn</uri><tag><name>page</name><tag-class>com.CloudJun.tag.PageTag</tag-class><body-content>JSP</body-content><attribute><name>pageBean</name><required>true</required><rtexprvalue>true</rtexprvalue></attribute></tag></taglib>

web.xml

<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns="http://xmlns.jcp.org/xml/ns/javaee"xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee http://xmlns.jcp.org/xml/ns/javaee/web-app_3_1.xsd"version="3.1"><display-name>Archetype Created Web Application</display-name><!-- Spring和web项目集成start --><!-- spring上下文配置文件 --><context-param><param-name>contextConfigLocation</param-name><param-value>classpath:spring-context.xml</param-value></context-param><!-- 读取Spring上下文的监听器 --><listener><listener-class>org.springframework.web.context.ContextLoaderListener</listener-class></listener><!-- Spring和web项目集成end --><!-- 中文乱码处理 --><filter><filter-name>encodingFilter</filter-name><filter-class>org.springframework.web.filter.CharacterEncodingFilter</filter-class><async-supported>true</async-supported><init-param><param-name>encoding</param-name><param-value>UTF-8</param-value></init-param></filter><filter-mapping><filter-name>encodingFilter</filter-name><url-pattern>/*</url-pattern></filter-mapping><!-- Spring MVC servlet --><servlet><servlet-name>SpringMVC</servlet-name><servlet-class>org.springframework.web.servlet.DispatcherServlet</servlet-class><!--此参数可以不配置，默认值为：/WEB-INF/springmvc-servlet.xml--><init-param><param-name>contextConfigLocation</param-name><param-value>classpath:spring-mvc.xml</param-value></init-param><load-on-startup>1</load-on-startup><!--web.xml 3.0的新特性，是否支持异步--><async-supported>true</async-supported></servlet><servlet-mapping><servlet-name>SpringMVC</servlet-name><url-pattern>/</url-pattern></servlet-mapping>
</web-app>

zhang.tld

<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns="http://xmlns.jcp.org/xml/ns/javaee"xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee http://xmlns.jcp.org/xml/ns/javaee/web-app_3_1.xsd"version="3.1"><display-name>Archetype Created Web Application</display-name><!-- Spring和web项目集成start --><!-- spring上下文配置文件 --><context-param><param-name>contextConfigLocation</param-name><param-value>classpath:spring-context.xml</param-value></context-param><!-- 读取Spring上下文的监听器 --><listener><listener-class>org.springframework.web.context.ContextLoaderListener</listener-class></listener><!-- Spring和web项目集成end --><!-- 中文乱码处理 --><filter><filter-name>encodingFilter</filter-name><filter-class>org.springframework.web.filter.CharacterEncodingFilter</filter-class><async-supported>true</async-supported><init-param><param-name>encoding</param-name><param-value>UTF-8</param-value></init-param></filter><filter-mapping><filter-name>encodingFilter</filter-name><url-pattern>/*</url-pattern></filter-mapping><!-- Spring MVC servlet --><servlet><servlet-name>SpringMVC</servlet-name><servlet-class>org.springframework.web.servlet.DispatcherServlet</servlet-class><!--此参数可以不配置，默认值为：/WEB-INF/springmvc-servlet.xml--><init-param><param-name>contextConfigLocation</param-name><param-value>classpath:spring-mvc.xml</param-value></init-param><load-on-startup>1</load-on-startup><!--web.xml 3.0的新特性，是否支持异步--><async-supported>true</async-supported></servlet><servlet-mapping><servlet-name>SpringMVC</servlet-name><url-pattern>/</url-pattern></servlet-mapping>
</web-app>

generatorConfig.xml

<?xml version="1.0" encoding="UTF-8" ?><!DOCTYPE generatorConfiguration PUBLIC "-//mybatis.org//DTD MyBatis Generator Configuration 1.0//EN""http://mybatis.org/dtd/mybatis-generator-config_1_0.dtd" >
<generatorConfiguration>
<!-- 引入配置文件 -->
<properties resource="jdbc.properties"/><!--指定数据库jdbc驱动jar包的位置-->
<classPathEntry location="D:\\temp\\mvn_repository\\mysql\\mysql-connector-java\\5.1.44\\mysql-connector-java-5.1.44.jar"/><!-- 一个数据库一个context -->
<context id="infoGuardian"><!-- 注释 --><commentGenerator><property name="suppressAllComments" value="true"/><!-- 是否取消注释 --><property name="suppressDate" value="true"/> <!-- 是否生成注释代时间戳 --></commentGenerator><!-- jdbc连接 --><jdbcConnection driverClass="${jdbc.driver}"connectionURL="${jdbc.url}" userId="${jdbc.username}" password="${jdbc.password}"/><!-- 类型转换 --><javaTypeResolver><!-- 是否使用bigDecimal， false可自动转化以下类型（Long, Integer, Short, etc.） --><property name="forceBigDecimals" value="false"/></javaTypeResolver><!-- 01 指定javaBean生成的位置 --><!-- targetPackage：指定生成的model生成所在的包名 --><!-- targetProject：指定在该项目下所在的路径  --><javaModelGenerator targetPackage="com.CloudJun.model"targetProject="src/main/java"><!-- 是否允许子包，即targetPackage.schemaName.tableName --><property name="enableSubPackages" value="false"/><!-- 是否对model添加构造函数 --><property name="constructorBased" value="true"/><!-- 是否针对string类型的字段在set的时候进行trim调用 --><property name="trimStrings" value="false"/><!-- 建立的Model对象是否 不可改变  即生成的Model对象不会有 setter方法，只有构造方法 --><property name="immutable" value="false"/></javaModelGenerator><!-- 02 指定sql映射文件生成的位置 --><sqlMapGenerator targetPackage="com.CloudJun.mapper"targetProject="src/main/java"><!-- 是否允许子包，即targetPackage.schemaName.tableName --><property name="enableSubPackages" value="false"/></sqlMapGenerator><!-- 03 生成XxxMapper接口 --><!-- type="ANNOTATEDMAPPER",生成Java Model 和基于注解的Mapper对象 --><!-- type="MIXEDMAPPER",生成基于注解的Java Model 和相应的Mapper对象 --><!-- type="XMLMAPPER",生成SQLMap XML文件和独立的Mapper接口 --><javaClientGenerator targetPackage="com.CloudJun.mapper"targetProject="src/main/java" type="XMLMAPPER"><!-- 是否在当前路径下新加一层schema,false路径com.oop.eksp.user.model， true:com.oop.eksp.user.model.[schemaName] --><property name="enableSubPackages" value="false"/></javaClientGenerator><!-- 配置表信息 --><!-- schema即为数据库名 --><!-- tableName为对应的数据库表 --><!-- domainObjectName是要生成的实体类 --><!-- enable*ByExample是否生成 example类 --><!--<table schema="" tableName="t_book" domainObjectName="Book"--><!--enableCountByExample="false" enableDeleteByExample="false"--><!--enableSelectByExample="false" enableUpdateByExample="false">--><!--&lt;!&ndash; 忽略列，不生成bean 字段 &ndash;&gt;--><!--&lt;!&ndash; <ignoreColumn column="FRED" /> &ndash;&gt;--><!--&lt;!&ndash; 指定列的java数据类型 &ndash;&gt;--><!--&lt;!&ndash; <columnOverride column="LONG_VARCHAR_FIELD" jdbcType="VARCHAR" /> &ndash;&gt;--><!--</table>--><table schema="" tableName="t_hotel" domainObjectName="Hotel"enableCountByExample="false" enableDeleteByExample="false"enableSelectByExample="false" enableUpdateByExample="false"></table></context>
</generatorConfiguration>

jdbc.properties

jdbc.driver=com.mysql.jdbc.Driver
jdbc.url=jdbc:mysql://localhost/mybatis_ssm?useUnicode=true&characterEncoding=UTF-8
jdbc.username=root
jdbc.password=123456

log4j2.xml

<?xml version="1.0" encoding="UTF-8"?><!-- status : 指定log4j本身的打印日志的级别.ALL< Trace < DEBUG < INFO < WARN < ERROR < FATAL < OFF。 monitorInterval : 用于指定log4j自动重新配置的监测间隔时间，单位是s,最小是5s. -->
<Configuration status="WARN" monitorInterval="30"><Properties><!-- 配置日志文件输出目录 ${sys:user.home} --><Property name="LOG_HOME">/root/workspace/lucenedemo/logs</Property><property name="ERROR_LOG_FILE_NAME">/root/workspace/lucenedemo/logs/error</property><property name="WARN_LOG_FILE_NAME">/root/workspace/lucenedemo/logs/warn</property><property name="PATTERN">%d{yyyy-MM-dd HH:mm:ss.SSS} [%t-%L] %-5level %logger{36} - %msg%n</property></Properties><Appenders><!--这个输出控制台的配置 --><Console name="Console" target="SYSTEM_OUT"><!-- 控制台只输出level及以上级别的信息(onMatch),其他的直接拒绝(onMismatch) --><ThresholdFilter level="trace" onMatch="ACCEPT"onMismatch="DENY" /><!-- 输出日志的格式 --><!-- %d{yyyy-MM-dd HH:mm:ss, SSS} : 日志生产时间 %p : 日志输出格式 %c : logger的名称 %m : 日志内容，即 logger.info("message") %n : 换行符 %C : Java类名 %L : 日志输出所在行数 %M : 日志输出所在方法名 hostName : 本地机器名 hostAddress : 本地ip地址 --><PatternLayout pattern="${PATTERN}" /></Console><!--文件会打印出所有信息，这个log每次运行程序会自动清空，由append属性决定，这个也挺有用的，适合临时测试用 --><!--append为TRUE表示消息增加到指定文件中，false表示消息覆盖指定的文件内容，默认值是true --><File name="log" fileName="logs/test.log" append="false"><PatternLayoutpattern="%d{yyyy-MM-dd HH:mm:ss.SSS} [%t] %-5level %logger{36} - %msg%n" /></File><!-- 这个会打印出所有的info及以下级别的信息，每次大小超过size， 则这size大小的日志会自动存入按年份-月份建立的文件夹下面并进行压缩，作为存档 --><RollingFile name="RollingFileInfo" fileName="${LOG_HOME}/info.log"filePattern="${LOG_HOME}/$${date:yyyy-MM}/info-%d{yyyy-MM-dd}-%i.log"><!--控制台只输出level及以上级别的信息（onMatch），其他的直接拒绝（onMismatch） --><ThresholdFilter level="info" onMatch="ACCEPT"onMismatch="DENY" /><PatternLayoutpattern="%d{yyyy-MM-dd HH:mm:ss.SSS} [%t] %-5level %logger{36} - %msg%n" /><Policies><!-- 基于时间的滚动策略，interval属性用来指定多久滚动一次，默认是1 hour。 modulate=true用来调整时间：比如现在是早上3am，interval是4，那么第一次滚动是在4am，接着是8am，12am...而不是7am. --><!-- 关键点在于 filePattern后的日期格式，以及TimeBasedTriggeringPolicy的interval， 日期格式精确到哪一位，interval也精确到哪一个单位 --><!-- log4j2的按天分日志文件 : info-%d{yyyy-MM-dd}-%i.log --><TimeBasedTriggeringPolicy interval="1"modulate="true" /><!-- SizeBasedTriggeringPolicy:Policies子节点， 基于指定文件大小的滚动策略，size属性用来定义每个日志文件的大小. --><!-- <SizeBasedTriggeringPolicy size="2 kB" /> --></Policies></RollingFile><RollingFile name="RollingFileWarn" fileName="${WARN_LOG_FILE_NAME}/warn.log"filePattern="${WARN_LOG_FILE_NAME}/$${date:yyyy-MM}/warn-%d{yyyy-MM-dd}-%i.log"><ThresholdFilter level="warn" onMatch="ACCEPT"onMismatch="DENY" /><PatternLayoutpattern="%d{yyyy-MM-dd HH:mm:ss.SSS} [%t] %-5level %logger{36} - %msg%n" /><Policies><TimeBasedTriggeringPolicy /><SizeBasedTriggeringPolicy size="2 kB" /></Policies><!-- DefaultRolloverStrategy属性如不设置，则默认为最多同一文件夹下7个文件，这里设置了20 --><DefaultRolloverStrategy max="20" /></RollingFile><RollingFile name="RollingFileError" fileName="${ERROR_LOG_FILE_NAME}/error.log"filePattern="${ERROR_LOG_FILE_NAME}/$${date:yyyy-MM}/error-%d{yyyy-MM-dd-HH-mm}-%i.log"><ThresholdFilter level="error" onMatch="ACCEPT"onMismatch="DENY" /><PatternLayoutpattern="%d{yyyy-MM-dd HH:mm:ss.SSS} [%t] %-5level %logger{36} - %msg%n" /><Policies><!-- log4j2的按分钟 分日志文件 : warn-%d{yyyy-MM-dd-HH-mm}-%i.log --><TimeBasedTriggeringPolicy interval="1"modulate="true" /><!-- <SizeBasedTriggeringPolicy size="10 MB" /> --></Policies></RollingFile></Appenders><!--然后定义logger，只有定义了logger并引入的appender，appender才会生效 --><Loggers><!--过滤掉spring和mybatis的一些无用的DEBUG信息 --><logger name="org.springframework" level="INFO"></logger><logger name="org.mybatis" level="INFO"></logger><!-- 第三方日志系统 --><logger name="org.springframework" level="ERROR" /><logger name="org.hibernate" level="ERROR" /><logger name="org.apache.struts2" level="ERROR" /><logger name="com.opensymphony.xwork2" level="ERROR" /><logger name="org.jboss" level="ERROR" /><!-- 配置日志的根节点 --><root level="all"><appender-ref ref="Console" /><appender-ref ref="RollingFileInfo" /><appender-ref ref="RollingFileWarn" /><appender-ref ref="RollingFileError" /></root></Loggers></Configuration>

spring-context.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"xsi:schemaLocation="http://www.springframework.org/schema/beans http://www.springframework.org/schema/beans/spring-beans.xsd"><import resource="classpath:spring-mybatis.xml"></import>
</beans>

spring-mvc.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"xmlns:aop="http://www.springframework.org/schema/aop"xmlns:mvc="http://www.springframework.org/schema/mvc"xsi:schemaLocation="http://www.springframework.org/schema/beans http://www.springframework.org/schema/beans/spring-beans.xsdhttp://www.springframework.org/schema/context http://www.springframework.org/schema/context/spring-context-4.3.xsdhttp://www.springframework.org/schema/aop http://www.springframework.org/schema/aop/spring-aop-4.3.xsdhttp://www.springframework.org/schema/mvc http://www.springframework.org/schema/mvc/spring-mvc.xsd"><!--1) 扫描com.zking.zf及子子孙孙包下的控制器(扫描范围过大，耗时)--><context:component-scan base-package="com.yuan"/><!--2) 此标签默认注册DefaultAnnotationHandlerMapping和AnnotationMethodHandlerAdapter --><mvc:annotation-driven /><!--3) 创建ViewResolver视图解析器 --><bean class="org.springframework.web.servlet.view.InternalResourceViewResolver"><!-- viewClass需要在pom中引入两个包：standard.jar and jstl.jar --><property name="viewClass"value="org.springframework.web.servlet.view.JstlView"></property><property name="prefix" value="/WEB-INF/jsp/"/><property name="suffix" value=".jsp"/></bean><!--4) 单独处理图片、样式、js等资源 --><!-- <mvc:resources location="/css/" mapping="/css/**"/><mvc:resources location="/js/" mapping="/js/**"/><mvc:resources location="WEB-INF/images/" mapping="/images/**"/>-->
<!--    <mvc:resources location="/static/" mapping="/static/**"/>--><aop:aspectj-autoproxy/>
</beans>

spring-mybatis.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" xmlns:tx="http://www.springframework.org/schema/tx"xmlns:aop="http://www.springframework.org/schema/aop"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/tx http://www.springframework.org/schema/tx/spring-tx.xsd http://www.springframework.org/schema/aop http://www.springframework.org/schema/aop/spring-aop.xsd"><!--1. 注解式开发 --><!-- 注解驱动 --><context:annotation-config/><!-- 用注解方式注入bean，并指定查找范围：com.javaxl.ssm及子子孙孙包--><context:component-scan base-package="com.yuan"/><context:property-placeholder location="classpath:jdbc.properties"/><bean id="dataSource" class="org.apache.commons.dbcp2.BasicDataSource"destroy-method="close"><property name="driverClassName" value="${jdbc.driver}"/><property name="url" value="${jdbc.url}"/><property name="username" value="${jdbc.username}"/><property name="password" value="${jdbc.password}"/><!--初始连接数--><property name="initialSize" value="10"/><!--最大活动连接数--><property name="maxTotal" value="100"/><!--最大空闲连接数--><property name="maxIdle" value="50"/><!--最小空闲连接数--><property name="minIdle" value="10"/><!--设置为-1时，如果没有可用连接，连接池会一直无限期等待，直到获取到连接为止。--><!--如果设置为N（毫秒），则连接池会等待N毫秒，等待不到，则抛出异常--><property name="maxWaitMillis" value="-1"/></bean><!--4. spring和MyBatis整合 --><!--1) 创建sqlSessionFactory--><bean id="sqlSessionFactory" class="org.mybatis.spring.SqlSessionFactoryBean"><!-- 指定数据源 --><property name="dataSource" ref="dataSource"/><!-- 自动扫描XxxMapping.xml文件，**任意路径 --><property name="mapperLocations" value="classpath*:com/yuan/**/mapper/*.xml"/><!-- 指定别名 --><property name="typeAliasesPackage" value="com/yuan/**/model"/><!--配置pagehelper插件--><property name="plugins"><array><bean class="com.github.pagehelper.PageInterceptor"><property name="properties"><value>helperDialect=mysql</value></property></bean></array></property></bean><!--2) 自动扫描com/javaxl/ssm/**/mapper下的所有XxxMapper接口(其实就是DAO接口)，并实现这些接口，--><!--   即可直接在程序中使用dao接口，不用再获取sqlsession对象--><bean class="org.mybatis.spring.mapper.MapperScannerConfigurer"><!--basePackage 属性是映射器接口文件的包路径。--><!--你可以使用分号或逗号 作为分隔符设置多于一个的包路径--><property name="basePackage" value="com/yuan/**/mapper"/><property name="sqlSessionFactoryBeanName" value="sqlSessionFactory"/></bean><bean id="transactionManager" class="org.springframework.jdbc.datasource.DataSourceTransactionManager"><property name="dataSource" ref="dataSource" /></bean><tx:annotation-driven transaction-manager="transactionManager" /><aop:aspectj-autoproxy/>
</beans>

StudentBizImpl

package com.zhanghao.Biz.Impl;import com.zhanghao.Biz.StudentBiz;
import com.zhanghao.mapper.StudentMapper;
import com.zhanghao.model.Student;
import com.zhanghao.utils.PageBean;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Service;import java.util.List;/*** @author zhanghao* @site* @company s集团* @create 2023-09-08 23:12*/
@Service
public class StudentBizImpl implements StudentBiz {@Autowiredprivate StudentMapper studentMapper;@Overridepublic int deleteByPrimaryKey(String sid) {return studentMapper.deleteByPrimaryKey(sid);}@Overridepublic int insert(Student record) {return studentMapper.insert(record);}@Overridepublic int insertSelective(Student record) {return studentMapper.insertSelective(record);}@Overridepublic Student selectByPrimaryKey(String sid) {return studentMapper.selectByPrimaryKey(sid);}@Overridepublic int updateByPrimaryKeySelective(Student record) {return studentMapper.updateByPrimaryKeySelective(record);}@Overridepublic int updateByPrimaryKey(Student record) {return studentMapper.updateByPrimaryKey(record);}@Overridepublic List<Student> selBySnamePager(Student student, PageBean pageBean) {return studentMapper.selBySnamePager(student);}}

PagerAspect

package com.zhanghao.aspect;import com.github.pagehelper.PageHelper;
import com.github.pagehelper.PageInfo;
import com.zhanghao.utils.PageBean;
import org.aspectj.lang.ProceedingJoinPoint;
import org.aspectj.lang.annotation.Around;
import org.aspectj.lang.annotation.Aspect;
import org.springframework.stereotype.Component;import java.util.List;/*** @author zhanghao* @site* @company s集团* @create 2023-08-25 17:01*/
@Aspect
@Component
public class PagerAspect {@Around("execution(* *..*Biz.*Pager(..))")public Object invoke(ProceedingJoinPoint args) throws Throwable {PageBean pageBean = null;//获取目标中的所有方法Object[] args1 = args.getArgs();for (Object o : args1) {if (o instanceof PageBean) {pageBean = (PageBean) o;break;}}if (pageBean != null && pageBean.isPagination()) {PageHelper.startPage(pageBean.getPage(), pageBean.getRows());}Object proceed = args.proceed();if (pageBean != null && pageBean.isPagination()) {PageInfo pageInfo = new PageInfo((List) proceed);pageBean.setTotal((int) pageInfo.getTotal());}return proceed;}}

PageTag

package com.zhanghao.tag;import com.zhanghao.utils.PageBean;import javax.servlet.jsp.JspException;
import javax.servlet.jsp.JspWriter;
import javax.servlet.jsp.tagext.BodyTagSupport;
import java.io.IOException;
import java.util.Map;
import java.util.Map.Entry;
import java.util.Set;public class PageTag extends BodyTagSupport{private PageBean pageBean;// 包含了所有分页相关的元素public PageBean getPageBean() {return pageBean;}public void setPageBean(PageBean pageBean) {this.pageBean = pageBean;}@Overridepublic int doStartTag() throws JspException {
//		没有标签体，要输出内容JspWriter out = pageContext.getOut();try {out.print(toHTML());} catch (IOException e) {e.printStackTrace();}return super.doStartTag();}private String toHTML() {StringBuffer sb = new StringBuffer();
//		隐藏的form表单---这个就是上一次请求下次重新发的奥义所在
//		上一次请求的URLsb.append("<form action='"+pageBean.getUrl()+"' id='pageBeanForm' method='post'>");sb.append("	<input type='hidden' name='page'>");
//		上一次请求的参数Map<String, String[]> paramMap = pageBean.getMap();if(paramMap != null && paramMap.size() > 0) {Set<Entry<String, String[]>> entrySet = paramMap.entrySet();for (Entry<String, String[]> entry : entrySet) {
//				参数名String key = entry.getKey();
//				参数值for (String value : entry.getValue()) {
//					上一次请求的参数，再一次组装成了新的Form表单
//					注意：page参数每次都会提交，我们需要避免if(!"page".equals(key)) {sb.append("	<input type='hidden' name='"+key+"' value='"+value+"' >");}}}}sb.append("</form>");//		分页条sb.append("<ul class='pagination justify-content-center'>");sb.append("	<li class='page-item "+(pageBean.getPage() == 1 ? "disabled" : "")+"'><a class='page-link'");sb.append("	href='javascript:gotoPage(1)'>首页</a></li>");sb.append("	<li class='page-item "+(pageBean.getPage() == 1 ? "disabled" : "")+"'><a class='page-link'");sb.append("	href='javascript:gotoPage("+pageBean.getPreivousPage()+")'>&lt;</a></li>");// less than 小于号
//		sb.append("	<li class='page-item'><a class='page-link' href='#'>1</a></li>");
//		sb.append("	<li class='page-item'><a class='page-link' href='#'>2</a></li>");sb.append("	<li class='page-item active'><a class='page-link' href='#'>"+pageBean.getPage()+"</a></li>");sb.append("	<li class='page-item "+(pageBean.getPage() == pageBean.getMaxPage() ? "disabled" : "")+"'><a class='page-link' href='javascript:gotoPage("+pageBean.getNextPage()+")'>&gt;</a></li>");sb.append("	<li class='page-item "+(pageBean.getPage() == pageBean.getMaxPage() ? "disabled" : "")+"'><a class='page-link' href='javascript:gotoPage("+pageBean.getMaxPage()+")'>尾页</a></li>");sb.append("	<li class='page-item go-input'><b>到第</b><input class='page-link'");sb.append("	type='text' id='skipPage' name='' /><b>页</b></li>");sb.append("	<li class='page-item go'><a class='page-link'");sb.append("	href='javascript:skipPage()'>确定</a></li>");sb.append("	<li class='page-item'><b>共"+pageBean.getTotal()+"条</b></li>");sb.append("</ul>");//		分页执行的JS代码sb.append("<script type='text/javascript'>");sb.append("	function gotoPage(page) {");sb.append("		document.getElementById('pageBeanForm').page.value = page;");sb.append("		document.getElementById('pageBeanForm').submit();");sb.append("	}");sb.append("	function skipPage() {");sb.append("		var page = document.getElementById('skipPage').value;");sb.append("		if (!page || isNaN(page) || parseInt(page) < 1 || parseInt(page) > "+pageBean.getMaxPage()+") {");sb.append("			alert('请输入1~"+pageBean.getMaxPage()+"的数字');");sb.append("			return;");sb.append("		}");sb.append("		gotoPage(page);");sb.append("	}");sb.append("</script>");return sb.toString();}
}

实现功能

StudentController

package com.zhanghao.web;import com.zhanghao.Biz.StudentBiz;
import com.zhanghao.model.Student;
import com.zhanghao.utils.PageBean;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.PathVariable;
import org.springframework.web.bind.annotation.RequestMapping;import javax.servlet.http.HttpServletRequest;
import java.util.List;/*** @author zhanghao* @site* @company s集团* @create 2023-09-08 21:52*/
@Controller
@RequestMapping("/student")
public class StudentController {@Autowiredprivate StudentBiz studentBiz;@RequestMapping("/list")public String list(Student student, HttpServletRequest request){PageBean pageBean = new PageBean();pageBean.setRequest(request);List<Student> students = studentBiz.selBySnamePager(student, pageBean);request.setAttribute("list",students);request.setAttribute("pageBean",pageBean);return "stu/list";}@RequestMapping("/add")public String add(Student student){studentBiz.insertSelective(student);return "redirect:list";}@RequestMapping("/del/{sid}")public String add(@PathVariable("sid") String sid){studentBiz.deleteByPrimaryKey(sid);return "redirect:/student/list";}@RequestMapping("/edit")public String edit(Student student){studentBiz.updateByPrimaryKeySelective(student);return "redirect:list";}@RequestMapping("/pareSave")public String pareSave(Student student, Model model){if(student!=null && student.getSid()!=null){Student s = studentBiz.selectByPrimaryKey(student.getSid());model.addAttribute("s",s);}return "stu/edit";}}

JSP

List.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"pageEncoding="UTF-8"%>
<!DOCTYPE html >
<html>
<head>
<%@ include file="/common/header.jsp" %>
</head>
<body>
<form class="form-inline"action="/student/list" method="post"><div class="form-group mb-2"><input type="text" class="form-control-plaintext" name="sname"placeholder="请输入学生名称"><!-- 			<input name="rows" value="20" type="hidden"> --><!-- 不想分页 -->
<%--        <input name="pagination" value="false" type="hidden">--%></div><button type="submit" class="btn btn-primary mb-2">查询</button><a class="btn btn-primary mb-2" href="/student/pareSave">新增</a>
</form><table class="table table-striped "><thead><tr><th scope="col">学生编号</th><th scope="col">学生名称</th><th scope="col">学生年龄</th><th scope="col">学生性别</th><th scope="col">操作</th></tr></thead><tbody><c:forEach  var="s" items="${list }"><tr><td>${s.sid }</td><td>${s.sname }</td><td>${s.sage }</td><td>${s.ssex }</td><td><a href="/student/pareSave?sid=${s.sid}">修改</a><a href="/student/del/${s.sid}">删除</a></td></tr></c:forEach></tbody>
</table>
<!-- 这一行代码就相当于前面分页需求前端的几十行了 -->
<z:page pageBean="${pageBean }"></z:page>
${pageBean}
</body>
</html>

edit.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><title></title>
</head>
<body>
<form action="${pageContext.request.contextPath }/${empty s ? 'student/add' : 'student/edit'}" method="post">学生编号:<input type="text" name="sid" value="${s.sid }"><br>学生姓名:<input type="text" name="sname" value="${s.sname }"><br>学生年龄:<input type="text" name="sage" value="${s.sage }"><br>学生性别:<input type="text" name="ssex" value="${s.ssex }"><br><input type="submit">
</form>
</body>
</html>

heard.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"pageEncoding="UTF-8"%>
<%@ taglib uri="http://jsp.veryedu.cn" prefix="z"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<!DOCTYPE html >
<html>
<head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><linkhref="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/4.5.0/css/bootstrap.css"rel="stylesheet"><scriptsrc="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/4.5.0/js/bootstrap.js"></script><base href="${pageContext.request.contextPath }" />
</head>

前端增删改查实现一般需要完成以下几个步骤：

前端页面设计。前端页面应该清晰明了，使用户易于理解和使用。需要定义表格用于展示数据，包括表头和表内容，同时还需要添加各种操作按钮用于增加、修改和删除数据。

接口设计。接口是前后端之间的桥梁，要实现增删改查功能，需要定义对应的增删改查接口。接口应该具有明确的功能和参数，以便前端能够正确调用。

数据库设计。数据库是存储数据的重要组成部分。需要定义对应的数据表，包括数据列、数据类型和主键等，以便后台能够存储数据并进行操作。

前端逻辑实现。前端需要编写对应的JavaScript代码来实现增删改查功能。具体包括：对表格进行初始化、监听操作按钮点击事件、调用后台接口进行数据操作等。

后台接口实现。后台接口需要根据前端定义的接口进行实现。一般需要包括对应的增删改查方法，以便能够正确处理前端传递的参数和数据。

后台逻辑实现。后台需要根据前端传递的参数和数据，进行相应的处理，包括数据的存储和修改、数据的查询和删除等。同时，还需要对数据进行校验和验证，保证数据的正确性和安全性。

综上所述，前端增删改查实现需要前后端配合完成，同时还需要遵循一定的规范和标准，才能够实现功能完善、性能优良的系统。