3

我正在使用这个 JavaScript 函数来创建一个具有无限滚动功能的 JSP 页面。

<script language="javascript" type="text/javascript">

var count = 0;

window.onload = loadSubPage;

$(window).scroll(function(){
    if  ($(window).scrollTop() == $(document).height() - $(window).height()){
    alert("load appLeadershipSubView function calling");
        loadSubPage();
    }
});

function loadSubPage()
{
    alert("load appLeadershipSubView called");
        $.ajax({
        cache: false,
        url: 'appLeadershipSubView.do?count=' + count,
        async : true,
        beforeSend: function(){
        },
        success: function(html){
            alert("success event");
            $('#mainDiv').append(html);
            count++;
        },
        complete: function(){
        }
    }
    );
} 

</script>

如您所见，我正在调用该loadSubPage函数以将appLeadershipSubView页面中的 html 内容附加到#mainDiv. 并且loadSubPage也在页面加载事件中被调用。

问题是当我向下滚动时，它会多次（有时 3 次）调用该loadSubPage函数并将重复的数据附加到 div 中。

由于我是 JSP 和 Javascript 的新手，我无法在这里找出问题所在。你能指出我这里的问题吗？

4

2 回答 2

6

添加一个布尔值以确保没有活动请求。在发出请求之前检查它是否处于活动状态。

var isActive = false;
$(window).scroll(function(){
    if  (!isActive && $(window).scrollTop() == $(document).height() - $(window).height()){
    isActive = true;

在回调中，将 isActive 设置为 false

success: function(html){
    $('#mainDiv').append(html);
    isActive = false;
于 2012-11-05T13:42:11.190 回答
2

我宁愿使用下划线的油门功能！

更干净，非hackish，您将专注于应用程序的逻辑，而不是做一些回调-布尔-重置-魔术。

于 2012-11-05T13:45:59.247 回答