单击时出现 jQuery 错误 -> 未捕获的类型错误：无法读取未定义的属性“顶部”

Question

我不是 jQuery 专家，我想知道在单击简单表格中的 2 个图标时，我是否做错了什么会在 jQuery 中生成错误。

具体来说，当我单击 pdf 图标或信封图标时，我在控制台中看到生成错误（每次单击 2 个图标之一时，数字都会增加）。另外，我为图标设置的链接不再有效。

在右边你可以看到我有一个动画。这只是我停用的脚本代码，以查看是否是问题所在，但没有奏效。

不幸的是，我正在为 CMS 使用一个插件，我无法更改它的代码。

这是错误

(index):62 Uncaught TypeError: Cannot read property 'top' of undefined

    at HTMLTableElement.<anonymous> ((index):62)

    at HTMLTableElement.dispatch (jquery-1.12.4.js:5226)

    at HTMLTableElement.elemData.handle (jquery-1.12.4.js:4878)

这是代码

//your current click function

$('.scroll').on('click',function(e){

    e.preventDefault();

    $('html,body').animate({

        scrollTop:$($(this).attr('href')).offset().top + 'px'

    },1000,'swing');

});

Answer 1

您可以尝试为这两个图标的链接添加一个类，例如我添加 class="clickable"：<a class="clickable" href="https://kirchmatt-breitenbach.ch/wp-content/uploads/2018/10/C16-0.2.pdf" target="_blank"><img src="https://kirchmatt-breitenbach.ch/wp-content/uploads/2018/10/pdf.png" height="20" width="auto"></a>然后将其添加到您的 javascript 中：$(".clickable, .clickable img").on('click', function(e){&nbsp; &nbsp;e.stopPropagation();}这样当您单击这两个链接时滚动 javascript 代码不会运行。

Answer 2

也许更改脚本：//your current click function$('.scroll').on('click',function(e){&nbsp; &nbsp; e.preventDefault();&nbsp; &nbsp; var href = $(this).attr('href'), $ele = $(href);&nbsp; &nbsp; if ($ele && $ele.offset()) {&nbsp; &nbsp; &nbsp; var top = $ele.offset().top + 'px'&nbsp; &nbsp; &nbsp; $('html,body').animate({&nbsp; &nbsp; &nbsp; &nbsp; scrollTop:top&nbsp; &nbsp; &nbsp; },1000,'swing');&nbsp; &nbsp; }&nbsp; &nbsp;});