Question

我正在尝试在dom就绪时加载我的scrolltoTop()函数，但是该事件未触发。你能请人帮我吗？

我的代码在这里：

<button class="scroll-top">
<i class="fa fa-angle-up" aria-hidden="true"></i>
</button>

：

"use strict";
function scrollToTop () {
  if ($('.scroll-top').length) {
    $(window).on('scroll', function (){
      if ($(this).scrollTop() > 200) {
        $('.scroll-top').fadeIn();
      }
      else {
        $('.scroll-top').fadeOut();
      }
    });
    $('.scroll-top').on('click', function() {
      $('html, body').animate({scrollTop : 0},1500);
      return false;
    });
  }
}

这是我的DOM ready函数：

jQuery(document).on('ready', function() {
  (function ($) {
    scrollToTop ();
  })(jQuery);
});

使用Jquery版本： jquery-3.4.1.min.js

Answer 1

观看此演示。当您运行脚本时，它将滚动到顶部

jQuery(document).on('ready', function() {

  $(window).scrollTop(0);
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div style="border:1px solid black;width:100px;height:150px;overflow:auto">
This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text.</div><br>

Answer 2

从jquery documentation开始，从版本3.0起

$( document ).ready(function() {
  // Handler for .ready() called.
});

被替换为

$(function() {
   // Handler for .ready() called.
});

也许尝试：

$(function() {
   window.scrollTo(0,0);
});

Answer 3

使用$(document).ready(function() {}

"use strict";

function scrollToTop() {
  console.log('Calling');
  if ($('.scroll-top').length) {
    $(window).on('scroll', function() {
      console.log($(this).scrollTop());
      if ($(this).scrollTop() > 200) {

        $('.scroll-top').fadeIn();
      } else {
        $('.scroll-top').fadeOut();
      }
    });
    $('.scroll-top').on('click', function() {
      $('html, body').animate({
        scrollTop: 0
      }, 1500);
      return false;
    });
  }
}


$(document).ready(function() {
  scrollToTop();
})

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<button class="scroll-top">
   <i class="fa fa-angle-up" aria-hidden="true"></i>
</button>

Answer 4

您需要传递要滚动到的高度！

例如，如果要开始，则需要传递0。

$("div").scrollTop(0);

scrollToTop不适用于jQuery（document）.on（'ready'，function（）{

4 个答案: