我有一个名为myitem.html的主html页面,然后我使用ajax来显示从itemembox .php文件加载的itembox,当我向下滚动itembox时,new.php文件中的新内容被附加在itembox的末尾,但是itembox中的新内容被附加了三次,这都是一样的,我怎么能只附加一次,
下面是itemembox .php
中的部分HTML代码<div id="itemscrollbox">
<ul id = "scroll">
<li>0 item</li>
<li>0 item</li>
<li>0 item</li>
<li>0 item</li>
<li>0 item</li>
</ul>
</div>
下面是itemembox .php文件中用于滚动更新的部分javascript代码:
function scroll() {
var scrolltop = $('#itemscrollbox').attr('scrollTop');
var scrollheight = $('#itemscrollbox').attr('scrollHeight');
var windowheight = $('#itemscrollbox').attr('clientHeight');
var scrolloffset = 0;
if (scrolltop >= (scrollheight - (windowheight + scrolloffset))) {
var ID = $("#myscroll li:last").attr("id");
$('#status').text('Loading more items...');
$.get('picturedata.php', 'id=' + ID + '', function(newitem) {
$('#scroll').append(newitem);
updateitemstatus();
});
}
setTimeout('scroll();', 2500);
}
是new.php文件中的部分代码:
输出应该是:
first item
second item
但是它给了我:
first item
second item
first item
second item
first item
second item
任何人都可以告诉我如何解决这个问题,非常感谢!下面是滚动函数的调用方式:
$(document).ready(function(){
updateitemstatus();
scroll();
});
我假设因为主HTML页面是myitem.html加载itembox在它里面,itembox追加新的内容从new.php而向下滚动,所以函数$。get被调用了三次,但是我不知道如何避免。
您应该在添加之前将您的结果div添加为$.clear()
。
$('#scroll').clear();
$.get('picturedata.php', 'id='+ ID+'', function(newitem){
$('#scroll').append(newitem);
updateitemstatus();
});