话不多说，首先我们定义一个form标签，在form标签里面定义一些文本框，具体代码如下:
<form id="classForm" onsubmit="return false;"><div class="form-group" style="display:flex;"><label class="control-label">请输入班级信息: </label></div><div class="form-group" style="display:flex;"><input type="hidden" id="_id" name="_id"th:value="${cla!=null and cla._id!=null }?${cla._id}: ''"><!--隐藏域--><input type="text" class="form-control col-sm-6" id="creator" name="creator"placeholder="*请输入创建人"th:value="${cla!=null and cla.creator!=null }?${cla.creator}: ''"required="true"><input type="text" class="form-control col-sm-6" id="classNmae" name="className"placeholder="*请输入班级名称"th:value="${cla!=null and cla.className!=null }?${cla.className}: ''"required="true"> </div><div class="form-group" style="display:flex;"><input type="text" class="form-control col-sm-6" id="teacherName" name="teacherName"placeholder="*请输入老师名称"th:value="${cla!=null and cla.teacherName!=null }?${cla.teacherName}: ''"required="true"></div><div class="form-group"><!-- 按钮 --> <button class="btn btn-info float-right" style="margin-left: 5px;"id="saveClassButton">保存班级信息</button> <button class="btn btn-secondary float-right" style="margin-left: 5px;"id="cancelClassButton">返回班级列表</button> </div></form>
使用ajax发送请求，提交表单数据给后端。
重点关注var form = new FormData(document.getElementById("表单id名称"))
这是一个我写此篇文章的主要目的，因为这样很方便，不用定义变量，记录每一个文本框的值，节省了大量的代码。
$('#saveClassButton').click(function () {alert("测试班级添加按钮");var data = new FormData(document.getElementById("classForm"));$.ajax({url: '/class/saveClass',type: 'post',data: data,processData: false,contentType: false,datatype: 'json',success: function (result) {if (r.resultCode == 200) {swal({title: '查询成功',type: 'success',showCancelButton: false,confirmButtonColor: '#1baeae',confirmButtonText: '返回商品列表',confirmButtonClass: 'btn btn-success',buttonsStyling: false}).then(function () {window.location.href = "/user/query_page";})}},error: function (result) {swal("操作失败" + result.message, {icon: "error",});}});});
controller接受请求（cla代表实体类对象,用它跟前端传递过来的文本框的值一一对应）。
/** 保存班级信息* */@RequestMapping("/saveClass")@ResponseBodypublic String saveClass(Cla cla) {System.out.println("测试班级前端填写的班级信息" + cla);return "123";}
总结
使用ajax发送请求，算是走了很大的一个坑，花了很多的时间在这上面，表面看起来，很简单，但是自己实际操作起来，会发现，细节特别多的。
ajax发送请求的主要难点，也就是当发送数据给后端的时候，前后端具体如何定义，数据的发送格式，以及数据的接受格式。
看完恭喜你，又知道了一点点! 你知道的越多，不知道的越多！ 感谢您的阅读，你的关注和评论，是对我学习的最大的支持，加油，陌生人，一起努力。
