我在数据库中有100个数据,我将在div上显示这些数据,但这些数据是逐个显示的,因为如果同时显示,会感觉滞后
这是我用来获取和显示数据的ajax
$.ajax({ type: "POST", url: site_url, data: {
limit: limit,
get_produk: mobile_form
}, dataType: "json", timeout: 60000, success: function(data) {
var data_produk = data.produk;
var list_produk = '';
for (var i = 0, len = data_produk.length; i < len; i++) {
list_produk += '<div class="wrapproduk goto_detil addproduk_'+data_produk[i].id+'">';
list_produk += filter;
list_produk += '<div class="wraptopproduk" '+addonclick+'>';
list_produk += '<div class="imgproduk" style="background-image:url('+global_url+''+data_produk[i].image+');"></div>';
list_produk += '<div class="titleproduk">'+data_produk[i].trim_title+'</div>';
list_produk += '<div class="priceproduk">'+format_angka(data_produk[i].harga)+'</div>';
list_produk += '</div>';
list_produk += '<div class="produk_pay_button '+add_grey+' produk_limit_'+data_produk[i].id+'" id="produk_limit_'+data_produk[i].id+'">';
list_produk += '<div class="btn_addtocart btn_ripple prod_front" id="add_front" '+addcart+'>'+lang.btn_details+'</div>';
list_produk += '<div class="addmin">';
list_produk += '<button class="btn_addtocart btn_ripple prod_minus prod_inline" id="prod_minus" onClick="btn_minus_cartfront(\''+data_produk[i].id+'\')"><img src="img/minus.png" width="20"></button>';
list_produk += '<input type="text" value="0" id="val_prod_'+data_produk[i].id+'" class="prod_inline val_prod_'+data_produk[i].id+' ">';
list_produk += '<button class="btn_addtocart btn_ripple prod_plus prod_inline" id="prod_plus" onClick="btn_plus_cartfront(\''+data_produk[i].id+'\')"><img src="img/plus.png" width="20"></button>';
list_produk += '</div>';
list_produk += '</div>';
list_produk += '<input type="hidden" value=\''+ JSON.stringify(data_produk[i]) +'\' id="dataproduk_'+data_produk[i].id+'">';
list_produk += '</div>';
$('#content_newproduk').html(list_produk);
}
}
});
如何通过动画和加载将数据逐一显示到#content_newproduk中
发布于 2018-05-28 14:05:09
您必须逐个从服务器获取数据。在上面的代码中,您需要修改url: site_url
,以便它一次返回一条记录,假设是基于您传递的ID。然后,您必须在循环中调用该方法。
但是,由于这些调用将是异步的和独立的,您可能会在UI上遇到顺序问题。所以你需要考虑以下几点: 1.顺序对你很重要吗? 2.你需要跟踪发送的请求,例如requestCount,然后适当地增加和减少它。3.根据请求数维护加载器的状态。
注:基于您提到的情况,我认为分批获取数据比逐个获取数据更好。根据性能或您的需求,批量获取数据(参考服务器端分页),然后显示它们。
https://stackoverflow.com/questions/50559198
复制相似问题