AJax数据异步交互

 Ajax数据异步交互就是将前端的数据传给后台，后台通过查找得到的相应数据返回给前端

直接上代码：

<p class="a0mtas gs gs3 gsrow tkz6 cf">
   <span class="a0mta g cf">
      <em class="">当前集团成员数：</em>
      <b class="" id="allperson">加载中...</b>//使用异步加载
   </span>
   <span class="a0mta g cf">
      <em class="z">上月企业代付(元)：</em>
      <!-- <input type="text" style="text-align:right" id="anoAmtTitle"></input> -->
      <b class="">${lastMonthAnoAmt}</b>
   </span>
   <span class="a0mta g cf">
       <em class="">上月个人付费(元)：</em>
      <!-- <input type="text" id="perAmtTitle"> -->
      <b class="">${lastMonthPerAmt}</b>

   </span>
</p>

<script>
window.onload=function(){
var allperson = 0;
   var t3 = document.getElementById('allperson');
   t3.value= " ";
   //获取成员总数
    $.ajax({ 
   "url":"${ctx}/account/bill/allperson",//方法路径
   "type":"post",//post方式
   "date":null,  //前端给后台数据为空          
   "success":function(data){
       var a=  document.getElementById('allperson');//原生jQuery获取对象等价于 $('#allperson').html('');
        a.innerHTML=data;                          //a= $('#allperson').html(data); data是后台发回来的数据，
   },
   error: function (data) {
      
       var a=  document.getElementById('allperson');
       a.value=" ";
       }
}); 
</script>

 

控制层

/** 
    * 获取总成员数
    */
@RequestMapping("/allperson")
@ResponseBody
public String allperson(HttpServletRequest re) throws Exception
{
    //String ecCode = this.getLoginUser().getEcCode();
    // System.out.println(ecCode);
   //获取最近的六个月
   //int allnumber = enterpriseBillService.getRecentSixMonth(ecCode);
   
   String mainType = "";
   HttpSession session = re.getSession();
   String totalMem = Long.toString((Long)session.getAttribute("totalMem"));
   if(totalMem!=null && !"".equals(totalMem)){
      return totalMem; //返回数据给前端
   }
   Map<String,Object> map = this.getRightParams();
   map.put("mainType", mainType);
   Long count=enterpriseBillService.countAliveCardOfEc(map);
   return String.valueOf(count);//返回数据给前端
}

总而言之，前端的数据都是通过后台查找得到的，比如该demo中的当前集团成员数是获取方法就是通过异步加载，同过id可以准确获取该位置，所以通过原生回去该对象，将后台返回的写给他，或者直接使用表达式赋值到相对应的位置