レンダリング：
インデックス.html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Title</title>
<!-- 以下方式定时转到其他页面 -->
<!-- <meta http-equiv="refresh" content="5;url=add.html">-->
</head>
<!-- springboot-->
<script src="/jquery-3.4.1.min.js"></script>
<script type="text/javascript" src="/js/jquery.easyui.min.js"></script>
<body>
<table border="1" style="border-collapse: collapse;">
<caption>基本的联系</caption>
<thead>
<tr>
<th>id</th>
<th>名字</th>
<th>登录账号</th>
<th>密码</th>
</tr>
</thead>
<tbody>
<tr th:each="user:${entities}">
<th th:text="${user.id}">id</th>
<th th:text="${user.name}">name</th>
<th th:text="${user.login}">login</th>
<th th:text="${user.password}">password</th>
<th>
<a class="btn btn-sm btn-primary" th:href="@{/selectUp/}+${user.id}">编辑</a>
<button th:attr="delete_uri=@{/delect/}+${user.id}" class="btn btn-sm btn-danger deleteBtn">删除</button>
</th>
</tr>
</tbody>
</table>
<!--定义一个form表单，发送delete请求-->
<form id="deleteEmpForm" method="post">
<input type="hidden" name="_method" value="DELETE">
</form>
<!--定义js方法，当点击删除按钮时，删除员工信息-->
<script>
$(".deleteBtn").click(function(){
//删除当前员工
$("#deleteEmpForm").attr("action", $(this).attr("delete_uri")).submit();//action指定执行方法请求路径
return false;
})
</script>
<div>
<div>================</div>
<a href = "/user/ahtml">
<button>新增</button >
</a>
</div>
</body>
</html>
追加.html
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<title>图书管理系统--新增图书</title>
</head>
<body>
<div class="breadcrumbs" id="breadcrumbs">
<ul class="breadcrumb">
<li class="blue"><i class="icon-home home-icon"></i></li>
<li class="blue">图书管理</li>
<li class="active">用户图书</li>
</ul>
</div>
<div class="page-content">
<div class="row">
<div class="col-xs-12">
<form id="book_form" class="form-horizontal" style="margin-top: 10px;">
<input id="bid" name="bid" type="hidden">
<div class="form-group">
<label class="col-sm-1 control-label no-padding-right" for="isbn"><font color="#e9573f">*</font>ISBN： </label>
<div class="col-sm-4">
<input type="text" id="isbn" name="isbn" placeholder="ISBN" class="form-control input-sm" onkeyup="this.value=this.value.replace(/[^0-9-]+/,'');">
</div>
</div>
<div class="form-group">
<label class="col-sm-1 control-label no-padding-right" for="book_name"><font color="#e9573f">*</font>图书名称：</label>
<div class="col-sm-4">
<input type="text" id="book_name" name="book_name" placeholder="图书名称" class="form-control input-sm">
</div>
</div>
<div class="form-group">
<label class="col-sm-1 control-label no-padding-right" for="book_author"><font color="#e9573f">*</font>作者：</label>
<div class="col-sm-4">
<input type="text" id="book_author" name="book_author" placeholder="作者" class="form-control input-sm">
</div>
</div>
<div class="form-group">
<label class="col-sm-1 control-label no-padding-right" for="book_type">图书类别：</label>
<div class="col-sm-4">
<select id="book_type" data-placeholder="图书类别" class="form-control chosen-select" name="book_type" style="display: none;">
<option value=""></option>
</select>
</div>
</div>
<div class="form-group">
<label class="col-sm-1 control-label no-padding-right" for="publishing_house"><font color="#e9573f">*</font>出版社： </label>
<div class="col-sm-4">
<input type="text" id="publishing_house" name="publishing_house" placeholder="出版社" class="form-control input-sm">
</div>
</div>
<div class="form-group">
<label class="col-sm-1 control-label no-padding-right" for="string_date"><font color="#e9573f">*</font>出版日期：</label>
<div class="col-sm-4">
<input readonly class="form-control date-picker input-sm" id="string_date" name="string_date" placeholder="出版日期" type="text" data-date-format="yyyy-mm-dd" style="height:30px;">
</div>
</div>
<div class="form-group">
<label class="col-sm-1 control-label no-padding-right" for="price"><font color="#e9573f">*</font>单价：</label>
<div class="col-sm-4">
<input type="text" id="price" name="price" placeholder="单价" class="form-control input-sm" onkeyup="value=value.replace(/[^\d.]/g,'')">
</div>
</div>
<div class="form-group">
<label class="col-sm-1 control-label no-padding-right" for="book_info">摘要：</label>
<div class="col-sm-4">
<textarea class="form-control input-sm" id="book_info" name="book_info" placeholder="摘要" style="padding-left:4px;"></textarea>
</div>
</div>
<div class="btn-group col-sm-5" style="text-align: right;">
<button type="submit" class="btn btn-sm btn-info" onclick="saveBook()" style="float: none;">
<i class="fa fa-save"></i>保存
</button>
<button type="button" onclick="resetForm()" class="btn btn-sm btn-success" style="float: none;">
<i class="fa fa-reply-all"></i>重置
</button>
</div>
</form>
</div>
</div>
</div>
<script type="text/javascript">
function adddemo(){
$.ajax({
type:"POST",//方法类型
dataType: "text",//预期服务器返回的数据类型 如果是对象返回的是json 如果是字符串这里一定要定义text 之前我就是定义json 结果字符串的返回一直到额error中去
/*
dataType:
要求为String类型的参数，预期服务器返回的数据类型。如果不指定，JQuery将自动根据http包mime信息返回responseXML或responseText，并作为回调函数参数传递。可用的类型如下：
xml：返回XML文档，可用JQuery处理。
html：返回纯文本HTML信息；包含的script标签会在插入DOM时执行。
script：返回纯文本JavaScript代码。不会自动缓存结果。除非设置了cache参数。注意在远程请求时（不在同一个域下），所有post请求都将转为get请求。
json：返回JSON数据。
jsonp：JSONP格式。使用SONP形式调用函数时，例如myurl?callback=?，JQuery将自动替换后一个“?”为正确的函数名，以执行回调函数。
text：返回纯文本字符串。
*/
url:"/user/adds",
data:$('#add').serialize(),
success: function (result) {
alert("成功")
window.location.href="/emps"
console.log(result);//打印服务端返回的数据(调试用)
if (result.resultCode == 200) {
alert("SUCCESS");
};
},
error : function(s,s2,s3) {
//数据成功传到后台 也有返回值 但就是报错 parsererror ：参考
// https://blog.csdn.net/AinGates/article/details/75250223 /
/*
写了一个ajax方法，后台一切正常，通过浏览器的F12工具查看XMLHttpRequest.status返回200，XMLHttpRequest.readyState返回4，也都没有问题。但是回调函数跳到error里，报parsererror的错误。经过排查，发现是因为后台返回时用了@ResponseBody注解（SpringMVC返回json格式的注解），但前台ajax提交没有定义dataType属性（定义服务器返回的数据类型）
还有一种情况是ajax方法中定义了 dataType:"json"属性，就一定要返回标准格式的json字符串，要不jQuery1.4+以上版本会报错的，因为不是用eval生成对象了，用的JSON.parse，如果字符串不标准就会报错。比如只返回一个简单的字符串“success”，“fail”， true，false，并不是标准的json字符串就会报错。
首先，jQuery 1.4版本之后对服务端返回的JSON 数据要求比较严格，必须严格按照JSON的标准来了。
*/
console.log(s)
console.log(s2)
console.log(s3)
alert("异常！");
}
})
}
/**
* 重置表单
*/
function resetForm() {
document.getElementById('book_form').reset();
$('#book_type').chosen('destroy');
$('#book_type').chosen();
$('#book_type_chosen').css({'width': '100%'});
}
jQuery(function ($) {
initSelect();
$('.date-picker').datepicker({language: 'zh-CN', autoclose: true}).next().on(ace.click_event, function () {
$(this).prev().focus();
});
});
</script>
</body>
</html>UserinfoMapper.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">
<!--数据源文件（告知程序着是数据源从这里拿数据Repository）-->
<mapper namespace="com.example.demo6.mapper.UserinfoMapper">
<resultMap id="userMap" type="com.example.demo6.demo.entity.UserEntity">
<id column="id" property="id" jdbcType="INTEGER"/>
<result column="name" property="name"/>
<result column="login" property="login"/>
<result column="password" property="password"/>
</resultMap>
<!-- 把一些数据都在一起 调用的时候直接写Man_sql_name 即可-->
<sql id="Man_sql_name">
id,name,login,password
</sql>
<!-- 查询全部信息-->
<select id="findall" parameterType="com.example.demo6.demo.entity.UserEntity" resultMap="userMap">
select
<include refid="Man_sql_name"/>
from tb_user
</select>
<!-- 根据id查询数据-->
<select id="getselectId" parameterType="integer" resultMap="userMap">
select
<include refid="Man_sql_name"/>
from tb_user where id=#{id}
</select>
<!-- 根据id删除数据-->
<delete id="delectId" parameterType="int">
delete
from tb_user where id=#{id}
</delete>
<!-- 新增数据-->
<insert id="addall" parameterType="com.example.demo6.demo.entity.UserEntity">
insert into tb_user
<trim prefix="(" suffix=")" suffixOverrides="," >
<if test="id != null" >
id,
</if>
<if test="name != null" >
name,
</if>
<if test="login != null" >
login,
</if>
<if test="password != null" >
password,
</if>
<if test="status != null" >
status,
</if>
<if test="CTime != null" >
C_TIME,
</if>
</trim>
<trim prefix="values (" suffix=")" suffixOverrides="," >
<if test="id != null" >
#{id,jdbcType=VARCHAR},
</if>
<if test="name != null" >
#{name,jdbcType=VARCHAR},
</if>
<if test="login != null" >
#{login,jdbcType=VARCHAR},
</if>
<if test="password != null" >
#{password,jdbcType=VARCHAR},
</if>
<if test="status != null" >
#{status,jdbcType=VARCHAR},
</if>
<if test="CTime != null" >
#{CTime,jdbcType=DATE},
</if>
</trim>
</insert>
<!-- 修改数据-->
<update id="update" parameterType="com.example.demo6.demo.entity.UserEntity">
update tb_user
<set>
<if test="name !=null">
name =#{name,jdbcType=VARCHAR},
</if>
<if test="login !=null">
login=#{login,jdbcType=VARCHAR},
</if>
<if test="password !=null">
password=#{password,jdbcType=VARCHAR},
</if>
</set>
where id=#{id,jdbcType=VARCHAR}
</update>
</mapper>