现在,来自Mongo db的动态数据是一次性加载的,但是我们想要通过scrolling.As加载它,我们滚动应该在一个页面中加载数据。
//我们尝试的是-添加延迟加载旋转木马,但不起作用。
function loadStartUp(){         
    $.ajax({
        url: '/createSection',
        type: 'get',
        dataType: 'json',
        success: function (data) {
            var i = 0;
             data.forEach(function(model){
                 console.log(model)
                $('#tbody').append(`
                    <tr>
                        <td>
                            <a href="#" class="tagModalWindow">${model.name}</a>
                        </td>
                        <td>
                            <a href="#" class="tagModalWindow">${model.description}</a>
                        </td>
                        <td>
                            <a href="#" class="tagModalWindow">${model.dashtype}</a>
                        </td>
                    </tr>
                `)
                navItem(model.name,i); 
                createSection(model.name, model.frequency, i,model.type,model.entity, model,model._id);
                if(model.parameters.length > 0){
                gettingData(model.parameters[0].para, model.parameters[0].startPeriod, i, model.parameters[0].calendar, model.parameters[0].month, model.parameters[0].calc, model.parameters[0].chartType, model.parameters[0].type, model.parameters[0].period, model.parameters[0].indi, model.parameters[0].k);  
                }
                i++;
            });
            carousel();
        }
    });
    function carousel(){
        console.log("carousel");
        $('.owl-carousel').owlCarousel({
            items: 2,
            singleItem: false,
            lazyLoad: true,
            loop:true,
            //Basic Speeds
            slideSpeed: 200,
            paginationSpeed: 800,
            rewindSpeed: 1000,
            autoWidth:true,
            responsiveClass:false,
            //Autoplay
            autoPlay: false,
            stopOnHover: false,
            // Navigation
            navigation: false,
            navigationText: [
                "<i class='icon-chevron-left icon-white left'></i>",
                "<i class='icon-chevron-right icon-white right'></i>"
            ],
            rewindNav: false,
            scrollPerPage: false,
            //Pagination
            pagination: false,
            paginationNumbers: false,
            responsive: true,
            responsiveRefreshRate: 200
        });
    }app.get('/createSection', isLoggedIn, (req, res, next)=>{         
    var query = {user:req.user._id};
    dashModel.find(query,(err, data)=>{
        if(err){
            console.log(err)
        } 
        console.log(data)
        res.send(data)
      })
    });提前谢谢。
发布于 2019-08-26 22:45:14
使用分页。对于客户端,如果搜索引擎优化很重要,我建议使用以下模式,因为这是谷歌能够抓取您的分页数据的唯一方式:https://www.quicksprout.com/how-to-create-an-seo-friendly-infinite-scrolling-page/
对于后端,我推荐使用mongoose来处理数据库,我只为它挑选了一个随机的分页库:https://www.npmjs.com/package/mongoose-paginate
https://stackoverflow.com/questions/57659423
复制相似问题