我正在尝试编程像facebook最近更新部分,所以我编程以下代码的jQuery和JavaScript
<script type="text/javascript">
var time ='<?php echo (time()); ?>';
time = 0;// remove later
var counter = 0;
var profile_url = '<?php echo (base_url()); ?>index.php/profile/';
var base_get_update_url = '<?php echo (base_url()); ?>index.php/pro_ajax/last_update/';
function get_update()
{
var get_update_url = base_get_update_url + time;
$.getJSON(get_update_url,function(data){
var count_result = data[0].length + data[1].length + data[2].length + data[3].length;
var update = $("#UpDate").children();
if ((update.length != 0) && (update.length + count_result) >= 15)
{
for (var i = 0;i < (update.length + count_result) && i < update.length;i++)
{
update = $("#UpDate").children();
update.last().remove();
}
}
for (var i = 0;i < data[0].length;i++)
{
$("#UpDate").prepend('<li><a href="'+profile_url+data[0][i][1]+'">'+data[0][i][0]+'<hr /></a></li>');
}
for (var i = 0;i < data[1].length;i++)
{
$("#UpDate").prepend('<li><a href="'+profile_url+data[1][i][1]+'">'+data[1][i][0]+'<hr /></a></li>');
}
for (var i = 0;i < data[2].length;i++)
{
$("#UpDate").prepend('<li><a href="'+profile_url+data[2][i][1]+'">'+data[2][i][0]+'<hr /></li>');
}
for (var i = 0;i < data[3].length;i++)
{
$("#UpDate").prepend('<li><a href="'+profile_url+data[3][i][1]+'">'+data[3][i][0]+'<hr /></a></li>');
}
});
}
setInterval("get_update()", 5000);
它将获得最后更新并成功显示它们,但它不能删除子节点。如果new element + before element大于15,它应该删除一些第一个元素。但它做不到,为什么?(下面的代码将显示UpDate部分):
<td style="width: 200px;text-align: left;border: 2px solid white" id="UpDate"></td>
删除元素可以用更简单的方式实现。考虑使用.slice()
方法,它允许您选择所选元素的一个子集,因此您可以通过以下调用删除#UpDate
元素的一些子元素:
$('#UpDate').children().slice(0, n).remove();
(n
是要删除的子元素的数量)
作为旁注,您似乎将<li>
元素添加到<td>
元素,这是无效的HTML。