开始总结自己在项目上的使用AJAX的情况:

  该图为向后台请求的数据,前台返回的结果,返回的数据类型为object,businessObj由许多key组成,我们项目前台需要调用的数据就藏在数组records中,可以通过

   var records=data['businessObj']['records'];

   将records打印出来,输出的内容为一个数组(我们项目中数组长度为1,项目初期,内容有点少,/(ㄒoㄒ)/~~~),每个数组又是由一个对象组成。

  下面上代码喽!!!!!!!!!!!!!!!!!!

 1         var count = 0;
2 /**
* 上拉加载具体业务实现
*/
// var n=1;
function pullupRefresh() {
setTimeout(function() {
mui('#pullrefresh').pullRefresh().endPullupToRefresh((++count > <?php echo $page?$page:0?>)); //参数为true代表没有更多数据了。
var table = document.body.querySelector('.mui-table-view');
var cells = document.body.querySelectorAll('.mui-table-view-cell');
// var len=10; var res=[];
$.ajax({
url: '__CONTROLLER__/messageAjax',
type: 'post',
dataType: 'json',
data: {pageIndex: count,type:'activity'},
})
.done(function(data) { var records=data['businessObj']['records'];
console.log(records); var len=records.length;
for (var i = 0; i < len; i++) {
var li = document.createElement('li');
li.className = 'mui-table-view-cell';
li.className = 'mui-table-view-cell';
li.innerHTML += '<p class="hdate">'+records[i]['sendTime']+'</p>'
                  //首先进行判断,是否含有h5URL链接,如果含有,再判断是否是已读的(1状态),再用字符串拼接的方法进行代码连接,在前台页面显示title、图片
if(records[i]['h5URL']){
if (records[i]['readStatus']==1) { li.innerHTML += '<a href= "'+records[i]['h5URL']+'?recordId='+records[i]['recordId']+'" recordid="'+records[i]['recordId']+'"><div class="hcon"><div class="hconW"><h2 class="fgrey">'+records[i]["title"]+'</h2><div class="bgblue"><img src='+records[i]['imgSrc']+'></div>'+'<p class="note" style="color:#999999;">'+records[i]['content']+'</p>'+'<p class="ckxq">查看详情<span class="seltarr2 fr mt10"></span></p></div></div></a>';
}else{
li.innerHTML += '<a href="'+records[i]['h5URL']+'?recordId='+records[i]['recordId']+'" recordid="'+records[i]['recordId']+'"><div class="hcon"><div class="hconW"><h2>'+records[i]["title"]+'</h2><div class="bgblue"><img src='+records[i]['imgSrc']+'></div>'+'<p class="note" style="color:#999999;">'+records[i]['content']+'</p>'+'<p class="ckxq">查看详情<span class="seltarr2 fr mt10"></span></p></div></div></a>'; }
}
                  //如果没有h5URL链接,对应就没有要显示的图片,显示对应的content就好
                   else{
if (records[i]['readStatus']==1) {
li.innerHTML += '<a onclick="updatestatus('+records[i]['recordId']+','+'/account/message/atDeatail/type/activity/recordId/'+records[i]['recordId']+')"><div class="hcon"><div class="hconW"><h2 class="fgrey">'+records[i]["title"]+'</h2><div class="bgblue"><img src='+records[i]['imgSrc']+'></div>'+'<p class="note" style="color:#999999;">'+records[i]['content']+'</p>'+'<p class="ckxq">查看详情<span class="seltarr2 fr mt10"></span></p></div></div></a>';
}else{
li.innerHTML += '<a onclick="updatestatus('+records[i]['recordId']+','+'/account/message/atDeatail/type/activity/recordId/'+records[i]['recordId']+')"><div class="hcon"><div class="hconW"><h2>'+records[i]["title"]+'</h2><div class="bgblue"><img src='+records[i]['imgSrc']+'></div>'+'<p class="note" style="color:#999999;">'+records[i]['content']+'</p>'+'<p class="ckxq">查看详情<span class="seltarr2 fr mt10"></span></p></div></div></a>';
}
}
                  //最后将生成的li添加到页面中
$("#va").append(li);
}
// console.log(li);
})
.fail(function() {
return ;
})
.always(function() {
console.log("complete");
}); }, 1500); }

AJAX第二发的更多相关文章

  1. jQuery之ajax实现篇

    jQuery的ajax方法非常好用,这么好的东西,你想拥有一个属于自己的ajax么?接下来,我们来自己做一个简单的ajax吧. 实现功能 由于jq中的ajax方法是用了内置的deferred模块,是P ...

  2. Ajax及跨域

    概念 Ajax Ajax,Asynchronous JavaScript and XML,字面意思:异步的 JavaScript 和 XML,是指一种创建交互式网页应用的网页开发技术. 用于异步地去获 ...

  3. 一个粗心的Bug,JSON格式不规范导致AJAX错误

    一.事件回放  今天工作时碰到了一个奇怪的问题,这个问题很早很早以前也碰到过,不过没想到过这么久了竟然又栽在这里. 当时正在联调一个项目,由于后端没有提供数据接口,于是我直接本地建立了一个 json ...

  4. ABP文档 - Javascript Api - AJAX

    本节内容: AJAX操作相关问题 ABP的方式 AJAX 返回信息 处理错误 HTTP 状态码 WrapResult和DontWrapResult特性 Asp.net Mvc 控制器 Asp.net ...

  5. ajax异步请求

    做前端开发的朋友对于ajax异步更新一定印象深刻,作为刚入坑的小白,今天就和大家一起聊聊关于ajax异步请求的那点事.既然是ajax就少不了jQuery的知识,推荐大家访问www.w3school.c ...

  6. 调用AJAX做登陆和注册

    先建立一个页面来检测一下我们建立的用户名能不能用,看一下有没有已经存在的用户名吗 可以通过ajax提示一下 $("#uid").blur(function(){ //取用户名 va ...

  7. Ajax 概念 分析 举例

    Ajax是结合了访问数据库,数据访问,Jquery 可以做页面局部刷新或者说是页面不刷新,我可以让页面不刷新,仅仅是数据的刷新,没有频繁的刷页面,是现在比较常用的一种方式做页面那么它是怎么实现页面无刷 ...

  8. ajax

    常见的HTTP状态码状态码:200 请求成功.一般用于GET和POST方法 OK301 资源移动.所请求资源移动到新的URL,浏览器自动跳转到新的URL Moved Permanently304 未修 ...

  9. 学习笔记之MVC级联及Ajax操作

    由于刚转型到MVC,MVC的架构模式很多不是很清楚,比如今天就想做个级联的操作,因为之前的ASP.NET的方式是通过:控件-->添加事件-->后台编写级联事件进行触发,但是这个MVC就不同 ...

随机推荐

  1. AngularJs的UI组件ui-Bootstrap

    http://www.cnblogs.com/pilixiami/p/5597634.html

  2. [转] 经典SQL练习题

    原题目来自qaz13177_58_CSDN博客 http://blog.csdn.net/qaz13177_58_/article/details/5575711/#sql 只是更新个人答案供参考 表 ...

  3. VS2010 MFC实现启动画面

    1.创建一个SDI工程(或者其他工程都可以). 2.创建一个位图资源命名为IDB_BITMAP1. 3.利用类向导添加一个类CMySplashCtrl(名字可以自己随便取). 4.在MySplashC ...

  4. python 学习(二)--关于类

    1.没有权限控制,在类方法或变量前加 "__" 两下划线,则变为"私有"变量(实际通过_<类名>__<变量或方法名> 可以访问) 2.类 ...

  5. IIS报错:Exception from HRESULT: 0x8007000B解决方法

    报错如下: System.Web.Services.dll 中发生,但未在用户代码中进行处理 其他信息: 服务器无法处理请求. ---> 尝试加载 Oracle 客户端库时引发 BadImage ...

  6. 还是this的问题

    var name = "The Window";    var object = {    name : "My Object",    getNameFunc ...

  7. js 倒计时(可自定义时间)

    <html> <head> <title>js 倒计时</title> </head> <body> <div> & ...

  8. 移动端js写法

    <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...

  9. mac上eclipse用gdb调试(转)

    mac上eclipse用gdb调试 With its new OS release, Apple has discontinued the use of GDB in OS X. Since 2005 ...

  10. 添加 index_combine hint的索引

    想试验一下 index_combine这个hint,于是做了如下试验. 1.创建一个具有若干index的表 SQL> create table test as select object_id, ...