Question

我的Web项目中有一个页面，显示从数据库加载的消息，如下所示：

 @foreach (var message in Model.Messages)
                    {
                        <tr>
                            <td class="message">
                                @message.Instance
                            </td>                                
                        </tr>
                    }

那么每当用户向上滚动页面时，如何使用LINQ Model.Messages.Take(30)加载示例30条消息

找到答案here，thnx以引起注意！

Answer 1

以下是测试

的快速示例代码

$(window).on("scroll", function() {

    var scrollHeight = $(document).height();
    var scrollPosition = $(window).height() + $(window).scrollTop();

    //check for scrollposition and height
    if(scrollPosition >= scrollHeight - 100)
    {
        //here load next messages
        loadNext();
    }
});

Answer 2

普通JS解决方案：

＆＃13;

var currentScroll = document.body.scrollTop;

window.addEventListener('scroll', function(e) {

  if (document.body.scrollTop < currentScroll) {
    // Load messages on scroll up
    console.log('scroll up');
  }

  currentScroll = document.body.scrollTop;
});

＆＃13;

Answer 3

这是一个简单的Js解决方案

var lastScrollTop = 0;
$(".chat-area").on("scroll", function (e) {
        let st = $(this).scrollTop(); //get current scroll position
        if(st < (lastScrollTop * 0.1)) { // if current position is in top 10$ of chat area make a call
        if(can_Scroll) { 
        can_Scroll = 0;// no more ajax calls until server responds with messages 
        fetchOldMessages(ajax call or function);}

    }
       lastScrollTop = st;

});

如何在鼠标滚动上加载消息？

3 个答案: