方法1:在input标签中加id,获取在页面输入的数据

step1:在input标签中加id属性,如id=“username” 和 id=“password”。
在这里插入图片描述

step2:发送ajax请求,将数据传入后端
在这里插入图片描述

step3:在后端获取数据(除了封装成对象外,还能根据step2中ajax请求时设置的参数名获取参数数据,如:String username)
在这里插入图片描述

方法2:用serialize()方法将表单序列化,获取在页面输入的表单数据

step1:
① 设置表单form标签id,以及input标签name属性名。
② name属性名一般与某个实体类中的属性名一致(一般来说也与数据库表中的字段名一致)。
③ 例:Address对象有中有receiver、province和city属性,就得设置name="receiver、"name="province"和name=“city”。
在这里插入图片描述

step2:如图,用serialize()方法获取表单数据赋给data,再用ajax请求传回后端。
在这里插入图片描述

step3:在后端获取传回来的参数数据(除了封装成对象外,还能根据定义的name属性名获取参数数据,如String reveiver)
在这里插入图片描述

方法3:new FormData()方法,获取在页面输入表单数据

step1:
① 设置表单标签的id,以及要input标签的name属性名
② name属性名一般与某个实体类中的属性名一致(一般来说也与数据库表中的字段名一致)。
③ 这里上传文件比较特殊,明显不是②中所说的一般情况。
在这里插入图片描述

step2:如图
① new FormData($("#file-upload"))获取到的是一个JQuery数组,这个数组存放的是对象,如果要取出对象就要加[0]。
② 若表单当中有多个,需要使用这些对象数据时,就要用每个中的name属性区分。
③ 可以用ajax请求将data传到后端。
④ FormData()的功能比较step2的rerialize()方法强大。
在这里插入图片描述

step3:在后端获取传回来的参数数据(除了封装成对象外,还能根据定义的name属性名获取参数数据,如MultipartFile file)。
在这里插入图片描述

方法X:待续…

待更新…

Logo

为开发者提供学习成长、分享交流、生态实践、资源工具等服务,帮助开发者快速成长。

更多推荐