ajax回调函数运用(由前端到后端代码全过程)

//ajax回调函数
function initActivityWorks(){
var backFun = function(jsonObject){
if(!jsonObject.success){
showSuccessOrErrorModel("获取信息错误，请联系管理员！","error");
return;
}
//初始化信息
initActivityWorksList(jsonObject);
};
//调用jquery帮助类（引用JqueryHelper.js）
var demoUrl=jQuery.getBasePath : "/showIndex/getActivityWorksList.bsh";
JqueryHelper.ajaxCon(demoUrl,{activityId:activityId},backFun);
}

//调用的JqueryHelper.js
var JqueryHelp = funtion() {
jqueryHelper.ajaxCon =function(url,para,sus){
$.ajax({
url :url,
dataType :'json',
type : "post",
data : para,
timeout : 30000,
success : function(set,status){
sus(set,status);
},
erroe : function(){
if（!window.console）{
//window.console web API 接口用于控制台调试，例如调用里面的方法console.log()
window.console ={log: function(){}};
}
console.log("[readyState]:"+xhr.readyState);
console.log("[xhrStatus]:"+xhr.status);
console.log("[status]:"+status);
console.log("[error]:"+error);
}
});
};

//在controller中编写getActivityWorksList方法

@RequestMapping("/getActivityWorksList.bsh")
@ResponseBody
public JSONObject getActivityWorksList (HttpServletRequest request){
JSONObject json = new JSONObject();
try
{
Map<String,Object>resultMap =showService.getActivityWorksList(request);
json.put("success",true);
json.put("activityWorksList",resultMap.get("activityWorksList"));

}catch(Exception e){
logger.error("[获取当前活动的所有作品异常!-ErrorMsg:]",e);
json.put("success",false);
json.put("msg", "获取当前活动的所有作品异常!");
}
return json;
}

//写完控制层，再写业务层serviceI接口,添加相应的方法
public Map<String,Object>getActivityWorksList(HttpServletRequest request);
//接着写业务实现层 serviceImpl，写方法的具体实现
public class ShowServiceImpl implements ShowService{
public Map<String,Object>getActivityWorksList(HttpServletRequest request){
//获取活动的id
String activityId =request.getParameter("activityId");
//参数列表(这里的参数类型parameterType与Mapper.xml中的一致)
Map<String,Object>params =new HashMap<String,Object>();
//存放参数
params.put("activityId",activityId);
//获取资源信息
List<Map<String,Object>>activityWorksList =showMapper.getActivityWorksList(params);
//返回的map(这里返回的结果集类型resultType与Mapper.xml中的一致)
Map<String,Object>resultMap =new HashMap<String,Object>();
resultMap.put("activityWorksList",activityWorksList);
return resultMap;
}
//dao层的接口
@Resource
private ShowMapper showMapper;
}

//写完controller，serviceI，serviceImpl，接着就到了dao层，取名ShowMapper
List<Map<String,Object>>getActivityWorksList(Map<String,Object>params);
//List中包Map解释
/**Map中存放的是key,value键值对，key为String类型，value为Object类型，list集合中存放的
*是单个元素，将Map中的键值对当作一个元素存放到list集合中，方便存取。*/

//接着写sql语句查询数据库，取名ShowMapper.xml(这里的文件名和dao层中的一致)
<mapper namespace="xxx.ShowMapper">
<select id="" parameterType="java.xxx" resultType="java.xxx">
//这里的resultType也可有resultMap来代替
SELECT XXX FROM 表名 WHERE 条件
</select>
</mapper>

/**小知识之myBatis传参parameterType类型
*myBatis的传参类型分为两种：
*1.基本数据类型：int,string,long,Date
*2.复杂数据类型：类和Map
*如何获取参数中的值
*1.基本数据类型：#{参数}获取参数中的值
*2复杂数据类型：#{属性名},map中则是#{key}
*/

//接着写js，通过拼接html方法从数据库中获取数据
function initActivityWorksLiist(jsonObject){
//上方在写回调函数的时候先定义了一个初始化initActivityWorksList方法，这里给予具体实现
var list =jsonObject.activityWorksList;
var objHtml ='';
if(list.length>0){
$("#编写网页中class下的id名").empty();
for(var i=0;i<list.length;i++)
{
var map=list[i];
objHtml +='<p class="Hidden">';
objHtml +='<span class="xxx"><img src="'+map.id名+'" /></span>';
objHtml +='</p>';
}
$("#id名").html(objHtml);

}

ajax回调函数运用(由前端到后端代码全过程)相关推荐

Ajax回调函数无反应及进erro问题记录。
一:问题描述 ajax回调函数,明明后台返回成功了,前端一直进Erro 二:问题反思 1.前端知识体系认知的不够完善.一直做后端的我,总感觉ajax套用模版就好,普通的模版,只有success,没写e ...
对ajax回调函数的研究
假如你现在还在为自己的技术担忧,假如你现在想提升自己的工资,假如你想在职场上获得更多的话语权,假如你想顺利的度过35岁这个魔咒,假如你想体验BAT的工作环境,那么现在请我们一起开启提升技术之旅吧,详情 ...
java如何构造ajax回调参数,jQuery实现ajax回调函数带入参数的方法示例
本文实例讲述了jQuery实现ajax回调函数带入参数的方法.分享给大家供大家参考,具体如下: 不带参数的写法: function pass(htmlId,auditingFlag){ var url ...
ajax回调函数有时成功有时失败,javascript - Ajax 回调函数行为随机。我做错了什么？...
我有以下行为随机的 ajax 函数.有时会显示警报 success finally.在其他情况下,第二个警报是显示 Failure: my status is 500. promptId 从调用函数 ...
解决ajax回调函数无返回值得问题
解决ajax回调函数无返回值得问题参考文章: (1)解决ajax回调函数无返回值得问题 (2)https://www.cnblogs.com/lzxlfly/p/5879167.html (3)ht ...
jQuery AJAX回调函数this指向问题
了解JavaScript的人都知道JavaScript的this不总是指向当前对象,函数或类中的this指向与调用这个函数的对象以及上下文环境是息息相关的.如在全局作用域调用一个含this的对象,此时 ...
spring返回数据使用ajax,【spring 后台跳转前台】使用ajax访问的后台，后台正常执行，返回数据，但是不能进入前台的ajax回调函数中...
问题1: 使用ajax访问的后台,后台正常执行,并且正常返回数据,但是不能进入前台的ajax回调函数中问题展示: 问题解决: 最后发现是因为后台的方法并未加注解:@ResponseBody,导致方法 ...
c ajax 图表,Pyechart Django：前端和后端分离（Ajax），多图表组合显示,pyechartsdjango,前后,ajax,合并,展示...
pyecharts django 前后端分离(ajax),多图表合并展示先看pyecharts 官方中文网站 pyecharts 官方中文网站了解到官方是有相关关于django支持的代码示例的. ...
关于Ajax回调函数内返回值无法给全局变量赋值的问题
众所周知,Ajax从后端获得数据到回调函数,想要将获取的值赋给全局变量的话要将Ajax中的async改为false,使其同步,不然js在按顺序执行时等请求发出后就先去执行Ajax下面的代码了. var ...
ajax回调函数的返回值,使用ajax和回调函数向函数传递/返回值
我试图读p_info函数返回从函数getproductInfo包含ajax调用,但我得到未定义的值.我使用回调函数来实现这一点,但仍然无法正常工作.我错在哪里?使用ajax和回调函数向函数传递/返回值 ...

ajax回调函数运用(由前端到后端代码全过程)

ajax回调函数运用(由前端到后端代码全过程)相关推荐

最新文章

热门文章