Question

我再次发现自己对JS感到沮丧！请帮忙！

下面是我用于简单聊天应用程序的一些代码，它通过AJAX请求刷新文本文件中的内容。同时它滚动到窗口的底部。我想要它，所以如果用户向上滚动以赶上它不会在刷新时通过将它们发送到底部来保持中断这种行为。我怎么能这样做

<script>

$(function() {
  startRefresh();  
});
function startRefresh() {
    setTimeout(startRefresh,3000);

    $.post('pollchat.php', function(data) {
         $('#content_div_id').html(data);
         var wtf    = $('#content_div_id');
         var height = wtf[0].scrollHeight;
         wtf.scrollTop(height); 
    });
}
</script>

任何帮助非常感谢。

Answer 1

请参阅我如何使用当前滚动位置并计算用户是否已滚动..

$(function() {
  startRefresh();
});

function startRefresh() {
  setTimeout(startRefresh, 1000);
  var wtf = $('#content_div_id');
  var currentScrollPos = wtf.scrollTop();
  var elementHeight = wtf[0].scrollHeight;
  var scroll = false;

  //User has scrolled, don't set scroll
  if (wtf.height() + currentScrollPos >= elementHeight) {
    scroll = true;
  }

  var data = $('#content_div_id').html();
  data += "Some Text<br/>";
  $('#content_div_id').html(data);

  if (scroll) {
    var height = wtf[0].scrollHeight;
    wtf.scrollTop(height);
  }
}

#content_div_id {
  max-height: 100px;
  overflow-y: scroll;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="content_div_id">
  Some Text
  <br/>Some Text
  <br/>Some Text
  <br/>Some Text
  <br/>
</div>

<强>更新试试这段代码，您可能需要修复一两件事......但是看看代码并获得一个想法

$(function() {
  startRefresh();  
});
function startRefresh() {
    setTimeout(startRefresh,3000);

    $.post('pollchat.php', function(data) {
        var wtf = $('#content_div_id');
        var currentScrollPos = wtf.scrollTop();
        var elementHeight = wtf[0].scrollHeight;
        var scroll = false;

        //User has scrolled, don't set scroll
        if (wtf.height() + currentScrollPos >= elementHeight) {
            scroll = true;
        }

         $('#content_div_id').html(data);
         if (scroll) {
            var height = wtf[0].scrollHeight;
            wtf.scrollTop(height);
        }
    });
}

如果用户不滚动，则仅滚动到底部

1 个答案: