「已注销」 2015-12-19 01:37 采纳率: 0%
浏览 1335
已结题

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

我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条回答

  • 寂灭天骄 2015-12-19 05:11
    关注

    你的代码不是已经基本实现动态生成div了么,加一个for循环动态拼装html元素就是了
    $.ajax({
    type : "POST",
    url : "XXX",
    async : true,
    success : function(data) {
    var innnerHTML = '';//要append到dom元素中得html
    var res = eval(data);//将json转换为数组对象。可以通过res.param(param为属性名来获取属性信息)
    //通过遍历res,拼装innnerHTML,最后append到dom下
    for (var i = 0; i < res.length; i++) {//
    if(res.length>6){
    innnerHTML+='XXX';
    }else{
    innnerHTML += 'XXX';
    }

                            }
                            $("#activity_list").html('');
                            $("#activity_list").html(innnerHTML);
                        }
                    });
    
    评论

报告相同问题?

悬赏问题

  • ¥15 素材场景中光线烘焙后灯光失效
  • ¥15 请教一下各位,为什么我这个没有实现模拟点击
  • ¥15 执行 virtuoso 命令后,界面没有,cadence 启动不起来
  • ¥50 comfyui下连接animatediff节点生成视频质量非常差的原因
  • ¥20 有关区间dp的问题求解
  • ¥15 多电路系统共用电源的串扰问题
  • ¥15 slam rangenet++配置
  • ¥15 有没有研究水声通信方面的帮我改俩matlab代码
  • ¥15 ubuntu子系统密码忘记
  • ¥15 保护模式-系统加载-段寄存器