js上滑手机加载更新

function throttle(func, wait) {
    let timeout = null;
    return function() {
        if (!timeout) {
            timeout = setTimeout(() => {
                func.apply(this, arguments);
                timeout = null;
            }, wait);
        }
    };
}

window.addEventListener('scroll', throttle(checkScrollPosition, 200));

let isLoading = false;

function loadMoreData() {
    if (isLoading) return;
    isLoading = true;
    // 发起加载请求...
    isLoading = false;
}

window.addEventListener('scroll', handleScroll);

// 在组件销毁或页面卸载时
window.removeEventListener('scroll', handleScroll);

<div id="content">
    <!-- 初始内容 -->
</div>
<div id="loading" style="display:none;">加载中...</div>

<script>
let allDataLoaded = false;
let isLoading = false;

function loadMoreData() {
    if (isLoading || allDataLoaded) return;
    isLoading = true;
    document.getElementById('loading').style.display = 'block';
    
    // 模拟异步加载数据
    setTimeout(() => {
        const contentDiv = document.getElementById('content');
        for (let i = 0; i < 10; i++) {
            const newItem = document.createElement('div');
            newItem.textContent = '新内容 ' + Date.now();
            contentDiv.appendChild(newItem);
        }
        isLoading = false;
        document.getElementById('loading').style.display = 'none';
    }, 1000);
}

function checkScrollPosition() {
    const contentDiv = document.getElementById('content');
    if (contentDiv.scrollHeight - window.innerHeight - contentDiv.scrollTop < 100) {
        loadMoreData();
    }
}

window.addEventListener('scroll', throttle(checkScrollPosition, 200));
</script>