SSM用jq整合Ajax入门案例讲解

最新推荐文章于 2022-08-25 16:25:01 发布

weixin_33788244

最新推荐文章于 2022-08-25 16:25:01 发布

阅读量218

点赞数

文章标签：数据库 json javascript ViewUI

原文链接：http://www.cnblogs.com/fangyunchen/p/9773594.html

版权

SSM用Jq整合Ajax

我就是一个程序小白，很多原理都不懂，下面的内容只能让新手知道怎么用。

Ajax

废话少说，总之像点赞，评论，之类的很多功能没必要进行页面跳转，更没必要牺牲整个页面来刷新局部区域，SSM框架用表单或者超链接的方式提交给Controller层都必须页面跳转，用Ajax其实和表单提交之类的没区别，只是不用跳转。

比如你想实现一个简单点赞增加功能，同时数据库保存信息

jsp代码

也就是点一下赞，赞的数量+1，数据库里用户1的点赞数量也+1

Jq代码

在<head>标签里引入jq，如果你的SSM项目路径里面有jq就按照引用js那样，如果没有，你就用我下面的代码

下面是jq代码（不懂不要紧，就是这样用，复制粘贴罢了）

var user=$("#sp1").text();//获取点赞对象：用户1

var sum=$("#sp2").text()//获取当前赞的数量，这里获取的是字符串
$("#bt1").click(function () {//给button设置点击事件
$.ajax({
url: "addZan", //这个对应Controller的URL，和你们以前表单里面的action一样
data: { //data就是你想要传什么数据到Controller层，这里的数据是json数据。

usera:user//多个数据用逗号隔开，usera其实相当于form里的name属性，这个名字和Controller层传过去的值对应

//user就是刚刚获取到的值

//其实这行代码可以写成 usera:$("#sp1").text()

},
type: "POST", //类型，POST或者GET,就和表单与超链接一样
dataType: 'text', //Controller层返回类型，如果返回String，就用text,返回json,就用json
success: function (data) { //成功，回调函数

alter(data.result);//可以用data调用Controller返回的值

$("#sp2").html(parseInt(sum)+1;);//点赞+1，先把sum强转为整再+1
},
error: function () { //失败，回调函数
alter("程序出错。。。");
}
});
})

})
</script>

Controller层

@RequestMapping("/addZan")//对应jq里面的url
@ResponseBody//需要传值就用这个注解
public String addZan(@RequestParam("usera") String usera) {//usera就是jq传进来的参数

//操作数据库，调用Sevice层，和SSM一模一样

String result="点赞成功";

retrun result;

}

转载于:https://www.cnblogs.com/fangyunchen/p/9773594.html

weixin_33788244

关注

0
点赞
踩
2

收藏

觉得还不错? 一键收藏
0
评论
SSM用jq整合Ajax入门案例讲解

SSM用Jq整合Ajax我就是一个程序小白，很多原理都不懂，下面的内容只能让新手知道怎么用。Ajax废话少说，总之像点赞，评论，之类的很多功能没必要进行页面跳转，更没必要牺牲整个页面来刷新局部区域，SSM框架用表单或者超链接的方式提交给Controller层都必须页面跳转，用Ajax其实和表单提交之类的没区别，只是不用跳转。比如你想实现一个简单点赞增加功能，同时数据库保存信息...
复制链接

扫一扫