yj_fly
碧波无敌
2015-12-19 01:37

jquery中如何在页面加载的时候根据action中的值的长度动态生成div

3
  • jquery

我action中的数据是保存在json中,然后要根据数据记录数生成多个div,

       //门店信息信息加载
       $.ajax({
               url:"findAllStoreInfoAction.action?workDate="+showCurrentTime(),
               dataType:"json",
               type:"POST",
               async:false,
               success: function (date){
                 var json = eval(date);
                 $.each(json, function(i, n){

                     createStoreDiv(json);
                 })
               }
       })    
   });

 //动态创建div
   function createStoreDiv(jsonData){
        console.info("nihao  div");
        //将actvColumns复制为空
        $("#actvColumns").html('');
        //循环action传来的jsonData中的数据
        $.each(jsonData,function(i){
          var storeName = jsonData[i].storeName; //门店名称
          var address   = jsonData[i].add_Detail; //地址
          var status    = jsonData[i].status; //状态
           console.info(storeName+" n "+address+status);
          if(i >= 6){
              //动态追加div
              $("#actvColumns").append("<div class='left' style='background-color: #68019a;'></div>"
                                    +"<div class='actColumnName' id='store"+i+"'>"+storeName+"</div>"
                                    +"<div class='actColumnNum'>"
                                    +"  <span style='font-weight: bold; font-size: 12px'>20</span> <span"
                                    +"      style='color: #333; font-size: 12px'>场</span>"
                                    +"</div>"
                                    +"<div class='pos'>"
                                    +"  <span style='font-size: 10px; margin-left: 15px;'>"+address+"</span>"
                                    +"</div>"
                                    +"<div class='topRight' style='background-color: #68019a;'>"+status+"</div>"
                                    +"<a><img src='images/institu/editAct.png'></a>");
              }else{
              //如果i大于6条 退出each循环,下面用分页显示
                return false;
              }
        })

            各给大神帮帮忙啊
  • 点赞
  • 回答
  • 收藏
  • 复制链接分享

2条回答