滚动到页面底部，重新加载然后重复

Question

我已经检查了所有可能与此相关的问题，但我似乎无法找到任何适合我的情况，或者答案都不好或不完整。

在我的情况下，我有一个html页面，其中包含一些php，显示竞争结果。当比赛开始时，带有结果的页面应滚动到页面底部，然后页面应该刷新（因此可能的新分数会出现），然后一次又一次地重复。什么是我的问题的最佳解决方案？

页面大小/长度会随着结果页面上的表格中出现更多数据而增加。

图片：

修改：

此代码现在滚动到页面底部，然后跳回到顶部并重复它正是我想要的，但我希望每次触及底部时refresh都有一个页面{{1转到顶部。

after this

Answer 1

您可以在页面中添加一些JavaScript：

<script>
window.scrollTo(0,document.body.scrollHeight);
setTimeout(function (){location.reload()},5000);
</script>

Answer 2

这可能就是你要找的东西：

Executor

jsfiddle

在你的ajax.php文件中，你可以回显新的分数：

// Test data, ignore
for(i = 1; i < 21; i++) {
    $('#results').append('<p>Test Result No.' + i + '</p>');
}

// Check every second (for example) if there is new data
// In this example there is always data
window.setInterval(function(){
  update_results();
}, 1000);

// Check for new results
function update_results() {
    $.ajax({
    type: 'POST',
    // Test data, ignore
    data: {
      html: 'new result'
    },
    // your ajax.php file
    url: '/echo/html/',
    success: function(data) {
      // Append new results to $('#results');
      // You might want to give back an array and loop through it with $.each(data, function() {});
      // you might also want to check for "false" if there are no new results
      $('#results').append('<p>' + data + '</p>');

      // Scroll to bottom smoothly
      $('html, body').animate({ scrollTop: $(document).height() }, 'slow');
    }
  });
}

鉴于$ score是您可能从数据库获得的分数数组。