想请教一下,要如何才能通过ajax获取到后台返回的数据
我排除的错误原因:
1.控制类请求后端失败(排除)(因为我 System.err.println(goods);语句在idea的console面板中显示出了商品的信息)排除查询失败的原因
2.url错误(排除)我按住了了ctrl点击所有的相关url都是可以成功跳转的
3.model没有将数据成功的传回前端(这个我也不确定)我在页面请求的同时用相同的方法是可以在前端显示的,但是通过点击事件触发就为空了
4.导包错误(排除)因为页面中别的jquery方法都是可以成功运行的
这是我的控制台中的报错
这是我的js代码
<script type="text/javascript" th:inline="javascript" >
$(function () {
/* type="text/javascript" th:inline="javascript" 是th中的内联语句作用是使javascript中可以使用model传回的数据*/
layui.use(['table', 'layer', 'form'], function() {
var table = layui.table;
var layer = layui.layer;
var form = layui.form;
$("[id^=type-]").click(function () {
//获取-隔开后的第一位的值
let typeId=this.id.split('-')[1];
console.log(typeId);
//res指的回传的对象
//这里尝试使用路径传参方法
$.post("/pages/back/goods/getGoodsByTypeId/" + typeId,function () {
//为了提高性能让goodsDic代替$('#goodsDic')这样系统就只用进行一次查询而不是多次
let goodsDic=$('#goodsDic');
var goods=[[${good}]];//后台传回前端的数据类型
console.log(goods);
goodsDic.empty();//清空goodsDic中的所有商品
for (let i=0;i<=goods.length;i++){
let goodsItem = $(" <div style=\"align-items: center;padding: 10px; border: solid lightblue 1px;box-shadow: 0 0 5px lightgray ;width:30% ;\" >\n" +
" <div><img src='"+goods.img+ "' style=\"width: 100%\"></div>\n" +
" <div style=\"color: orangered\">¥<span style=\"font-size: 20px\">"+goods.price+"</span></div>\n" +
" <div id=\"goods_title\">"+goods.title+ "</div>\n" +
" <div style=\"color:deepskyblue;font-weight: bold;font-size: 16px;padding: 5px\">99万+<span style=\"color: gray\">"+goods.evaluationCount+"万+</span></div>\n" +
" <div style=\"color: gray;font-size: 12px\">"+goods.merchantName+"</div>\n" +
" </div>");
goodsDic.append(goodsItem);
}
});
/* $.ajax({
url: "/pages/back/goods/getGoodsByTypeId/" + typeId,//如果不可以可以加入http
method: "POST",
success: function (data) {
console.log(data);
}
});*/
alert(this.id);
});
});
})
</script >
这是我的控制类代码
@RequestMapping("getGoodsByTypeId/{typeId}")
//因为使用了路径传参的方式所以必须要加入@PathVariable注解
//并且前端中的路径要在getGoodsByTypeId再加入一个/否者无法识别跳转
public String getGoodsByTypeId(@PathVariable Integer typeId, Model model){
System.err.println(typeId);
List<Goods> goods= goodsService.getGoodsByTypeId(typeId);
System.err.println(goods);
model.addAttribute("goods",goods);
/* if (goods==null){
System.err.println("查询无此类商品");
model.addAttribute("msg","查询无此类商品");
}else {
model.addAttribute("good",goods);
}*/
return "index";
}