<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <!DOCTYPE html> <html> <head> <meta charset="ISO-8859-1"> <title>Insert title here</title> </head> <script type="text/javaScript" src="${pageContext.request.contextPath }/js/jquery-3.6.0.min.js"> </script> <body> <form name="Form2" id="form2" action ="" method="post" enctype="multipart/form-data"> 姓名:<input type="text" name="name" id="name"> 密码:<input type="text" name="password" id="password"> <input type="button" value="测试" onclick="testJson()" /> </form> </body> <script type="text/javascript"> function testJson() { alert("进来了"); var name = $("#name").val(); var password = $("#password").val(); alert("姓名"+name+",学校:"+password); $.ajax({ //请求路径 url : "fileupload", //请求类型 type : "post", //data表示发送的数据 data :{ "name" : name, "password" : password }, //定义发送请求的数据格式为JSON字符串 contentType : "application/json;charset=utf-8", //定义回调响应的数据格式为JSON字符串，该属性可以省略 dataType : "json", //成功响应的结果 success : function(data) { alert(data); if (data != null) { alert("输入的用户名：" + data.name + "，密码：" + data.password); } } }); } </script> </html>
上面是jsp页面
controller方法
package com.zjf.controller; import java.util.HashMap; import java.util.Map; import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletResponse; import org.springframework.stereotype.Controller; import org.springframework.web.bind.annotation.RequestMapping; import org.springframework.web.servlet.ModelAndView; import org.springframework.web.servlet.view.json.MappingJackson2JsonView; @Controller public class FileUpLoad { @RequestMapping("/fileupload") public ModelAndView fileupload(HttpServletRequest request,HttpServletResponse rs) { String name = request.getParameter("name"); String password = request.getParameter("password"); System.out.println("name:"+name+",password:"+password); Map<String, String> map = new HashMap<>(); map.put("name", name+"1"); map.put("password", password+"1"); return new ModelAndView(new MappingJackson2JsonView(), map); } }
调用的时候 request.getParameter("name");获取的值一直是null;
调试N次 最后发现是 contentType 的问题。真是无语！去掉 contentType 就可以获取到 data值了
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <!DOCTYPE html> <html> <head> <meta charset="ISO-8859-1"> <title>Insert title here</title> </head> <script type="text/javaScript" src="${pageContext.request.contextPath }/js/jquery-3.6.0.min.js"> </script> <body> <form name="Form2" id="form2" action ="" method="post" enctype="multipart/form-data"> 姓名:<input type="text" name="name" id="name"> 密码:<input type="text" name="password" id="password"> <!-- 上传人:<input type="text" name="name"> 上传名:<input type="text" name="fileName"> --> <input type="button" value="测试" onclick="testJson()" /> </form> </body> <script type="text/javascript"> function testJson() { alert("进来了"); var name = $("#name").val(); var password = $("#password").val(); alert("姓名"+name+",学校:"+password); $.ajax({ //请求路径 url : "fileupload", //请求类型 type : "post", //data表示发送的数据 data :{ "name" : name, "password" : password }, //定义回调响应的数据格式为JSON字符串，该属性可以省略 dataType : "json", //成功响应的结果 success : function(data) { alert(data); if (data != null) { alert("输入的用户名：" + data.name + "，密码：" + data.password); } } }); } </script> </html>