我试图根据用户数以div块显示用户数据。我将使用ajax从服务器获取用户和数据的数量。我想在单独的div块中显示用户数据。如果用户数为2,我想显示两个块,三个块中显示3个用户...我定义了一个div

<div class = "users> </div>.


在这个div内,我想附加用户详细信息,例如

<div class=" user1"> <p><span class="name"></span></p>
<p><span class="age"></span></p>
<p><span class="address"></span></p>
</div>


使用jQuery。如果有两个用户,我必须在中间显示块。根据用户数量,我必须对齐块。(例如:6个用户-一行3个)
如何在div中显示数据?

码:

 <div class="users">
               <div class="user1">

                        <p> <span class="name">  </span> </p>
                        <p> <span class="age">          </span> </p>
                        <p> <span class="address">     </span> </p>
                        <p> <span class="phone">    </span> </p>
                    </div>


                 <div class="user2">

                        <p> <span class="name">  </span> </p>
                        <p> <span class="age">          </span> </p>
                        <p> <span class="address">     </span> </p>
                        <p> <span class="phone">    </span> </p>
                    </div>

            </div>
for(var user_name in res) {

  $.ajax({
        type: 'GET',
        timeout: 10000,
        dataType: 'json',
 url:  multidashboard_info_url + '?client=' + user_name,
        async: true,
     })
     .done(function(data) {
     console.log(" success and data is ",data);
        var dashboard_info = data["dashboard_info"];
        var name = dashboard_info["details"]["name"],
        age = dashboard_info["details"]["age"],
        address = dashboard_info["details"]["address"],



     })
     .fail(function() {
        console.log("error");
     })


}

最佳答案

您可以使用append()方法在html内添加内容,对于多个解决方案,您需要创建一个动态函数,如下所示:

Here is working jsFiddle.

function addUserData($selector,name,age,address) {
    $selector.append('<p><span class="name">'+ name +'</span></p>' +
                     '<p><span class="age">'+ age +'</span></p>' +
                     '<p><span class="address">'+ address +'</span></p>');
}

var name1 = 'John',
age1 = 23,
address1 = 'New York';
addUserData($('.user1'),name1,age1,address1);

var name2 = 'Wall',
age2 = 32,
address2 = 'Istanbul';
addUserData($('.user2'),name2,age2,address2);

10-05 21:06
查看更多