时间戳

首页 > 解决方案 > 元素滚动无法从数据库加载更多数据

javascript - 元素滚动无法从数据库加载更多数据

问题描述

我有这段代码用于使用元素上的垂直滚动来加载一些数据，但如果我将'div[data-tk="or"] .data .datadivmain'更改为记录它的工作但我想使用元素滚动它就不起作用. 对此有什么想法吗？

  $('div[data-tk="or"] .data .datadivmain').scroll(function(e) {
            // grab the scroll amount and the window height
            var scrollAmount = $('div[data-tk="or"] .data .datadivmain').scrollTop();
            console.log('scroll position amount:', scrollAmount);

    var documentHeight = $(document).height();
    // calculate the percentage the user has scrolled down the page
    var scrollPercent = (scrollAmount / documentHeight) * 100;
    if (scrollPercent > 30) {
        var main_data = $('div[data-tk="or"] .data .datadivmain');
        $(new_data).children().appendTo(main_data);
        $(Dahlia.V.currentPage.main + " .nex a").click();
    }

});

标签： javascriptjquerydom

解决方案

问题在于加载代码，尽管我已经在准备好的文档中添加了它仍然无法正常工作，所以我使用了该setTimeout功能并且它现在可以正常工作。

setTimeout(function() {
        var new_data = $('div[data-tk="ro"] .data .datadiv');
        new_data.css('display', 'none');
        $('div[data-tk="ro"] .data .pagination ,div[data-tk="ro"] .data .listcount').css('display', 'none');
        var datadivmain = $("<div></div>").addClass("datadivmain");
        datadivmain.css({ 'overflow-y': 'auto', 'height': '500px' });

    if (!$('div[data-tk="ro"] .data .datadivmain').length > 0) {
        datadivmain.insertBefore(new_data);
        var main_data = $('div[data-tk="ro"] .data .datadivmain');
        $(new_data).children().appendTo(main_data);
    }
    $('div[data-tk="ro"] .data .datadivmain').scroll(function() {
        var main_data = $('div[data-tk="ro"] .data .datadivmain');
        // grab the scroll amount and the window height
        var scrollAmount = main_data.scrollTop();
        var documentHeight = main_data.height();
        var full_height = main_data[0].scrollHeight;
        // calculate the percentage the user has scrolled down the page
        var scrollPercent = (scrollAmount / (full_height - documentHeight)) * 100;
        // console.log('full_height', scrollPercent);
        if (scrollPercent > 96) {
            $(new_data).children().appendTo(main_data);
            $(Dahlia.V.currentPage.main + " .nex a").click();
        }

    });
}, 1000);

推荐阅读