时间戳

首页 > 解决方案 > 尝试重写已弃用的 jquery 函数 fn.click()

javascript - 尝试重写已弃用的 jquery 函数 fn.click()

问题描述

我正在为一个非常古老的 wordpress 网站更新 jQuery。我有下面的功能，我正在尝试重写：

$(".smscroll").click(function(event){
    event.preventDefault();

    //  CALCULATE DESTINATION PLACE
    var dest = 0;

    if ($(this.hash).offset().top > ($(document).height() - $(window).height()))
    {
        dest = $(document).height() - $(window).height();
    }
    else
    {
        dest = $(this.hash).offset().top;
    }

    //  GO TO DESTINATION
    $('html,body').animate({scrollTop:dest}, 1000, 'swing');
});

我意识到这.click已被弃用。所以，我试图用以下内容替换它：

$(document).on("click", ".smscroll", function(event){
    event.preventDefault();
  
    //  CALCULATE DESTINATION PLACE
    var dest = 0;
  
    if ($(this.hash).offset().top > ($(document).height() - $(window).height()))
    {
        dest = $(document).height() - $(window).height();
    }
    else
    {
        dest = $(this.hash).offset().top;
    }
  
    //  GO TO DESTINATION
    $('html,body').animate({scrollTop:dest}, 1000, 'swing');
  });

我还需要清理什么来摆脱弃用？

标签： javascriptjquery

解决方案

您的代码似乎不再包含已弃用的功能，尽管 $(document).on('click', scope, callback)是多余的。$(scope).on('click', callback)像这样使用：

$(".smscroll").on("click", function(event) {
  event.preventDefault();
  var dest = 0;
  if ($(this.hash).offset().top > ($(document).height() - $(window).height())) {
    dest = $(document).height() - $(window).height();
  } else {
    dest = $(this.hash).offset().top;
  }
  $('html,body').animate({
    scrollTop: dest
  }, 1000, 'swing');
});

当然，假设在加载了所有.smscroll需要选择的元素之后应用事件侦听器。当然，如果您的目标是将点击事件委托给.smscroll类，请不要使用它。

推荐阅读