开始总结自己在项目上的使用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. 启动Tomcat服务器报错

    启动Tomcat服务器报错: Several ports (8005, 8080, 8009) required by Tomcat v5.5 Server at localhost are alre ...

  2. 【原创】我所理解的自动更新-APP发布与后台发布

    发布后台 创建渠道:添加新的渠道,设置渠道名称,自动生成渠道id.    查看渠道:查看渠道基本信息,渠道app版本号,资源版本号,是否开启更新.    创建/更新APP:选择打包ios,androi ...

  3. EditPlus 3.8.1346 中文版(6月16日更新)

    新的版本增加了粘贴时自动调整行首缩进的功能(“编辑”菜单→剪贴板→粘贴时自动缩进),非常方便.建议各位马上更新.

  4. ioctl--字符设备的控制技术【转】

    本文转载自:http://blog.csdn.net/coding__madman/article/details/51356313 字符设备的控制 1. 字符设备控制理论 1.1 作用 大部分驱动程 ...

  5. 整理单机安装RabbitMQ,留着备用

    一.安装erlang 1.安装erlang依赖: yum install build-essential openssl openssl-devel unixODBC unixODBC-devel m ...

  6. Cocos2dx3.11.1Android播放视频,后台 黑屏,无法记忆播放bug修改

    /* * Copyright (C) 2006 The Android Open Source Project * Copyright (c) 2014 Chukong Technologies In ...

  7. js 判断所选时间(或者当前时间)是否在某一时间段用于不同时间段显示不同的客服qq

    //qq交谈 var nowtimes= new Date(); var starttimes="16:30"; var endtimes="23:59"; v ...

  8. jmx配置

    # ----- Execute The Requested Command ----------------------------------------- # ----- JMX Config S ...

  9. window 常用快捷键

    1.新建文件夹  ctrl+shift+n 2.删除文件夹  ctrl+d 3.打开命令行  窗口+r 4.关闭命令行  命令行内输入exit然后回车 5.快捷键操作浏览器 1)ctrl+w关闭当前标 ...

  10. oracle 删除用户时的坑

    ORACLE在使用 SELECT SID,SERIAL# FROM V$SESSION WHERE USERNAME='dt_zntg_trade' 删除会话时,一定要注意dt_zntg_trade的 ...