Javascript 为什么会发生此 JQuery 错误?动画不是函数

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/43067555/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-23 01:39:24  来源:igfitidea点击:

Why is this JQuery error happening? Animate is not a function

javascriptjquery

提问by Duhanes

I am learning jQuery and trying to work my way around a scroll effect. Anyway, I am trying to make this code work but having trouble in doing so. It breaks when It runs the animate function:

我正在学习 jQuery 并试图解决滚动效果。无论如何,我正在尝试使此代码正常工作,但在这样做时遇到了麻烦。当它运行 animate 函数时它会中断:

I would really appreciate your help on this one. Thank you.

我真的很感激你在这方面的帮助。谢谢你。

Uncaught TypeError: $(...).animate is not a function
at HTMLAnchorElement. (script.js:58)
at HTMLDocument.dispatch (jquery-3.1.1.slim.min.js:3)
at HTMLDocument.q.handle (jquery-3.1.1.slim.min.js:3)

Uncaught TypeError: $(...).animate 不是
HTMLAnchorElement的函数。(script.js:58)
在 HTMLDocument.dispatch (jquery-3.1.1.slim.min.js:3)
在 HTMLDocument.q.handle (jquery-3.1.1.slim.min.js:3)

// Select anchor tags to click on 
$(document).on("click", "a", function(event) {
  console.log("item clicked");

  // Clear out the default action  
  event.preventDefault();
  console.log("working until now");

  // Animate to selected selected target
  $("html,body").animate({
    scroll: $($(this).attr('href')).offset().top
  }, 900);
  console.log("no errors for now");
});
<script src="https://code.jquery.com/jquery-3.1.1.slim.min.js" integrity="sha384-A7FZj7v+d/sdmMqp/nOQwliLvUsJfDHW+k9Omg/a/EheAdgtzNs3hpfag6Ed950n" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/tether/1.4.0/js/tether.min.js" integrity="sha384-DztdAPBWPRXSA/3eYEEUWrWCy7G5KFbe8fFjk5JAIxUYHKkDx6Qin1DkWx51bBrb" crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/js/bootstrap.min.js" integrity="sha384-vBWWzlZJ8ea9aCX4pEW3rVHjgjt7zpkNpZk+02D9phzyeVkE+jo0ieGizqPLForn" crossorigin="anonymous"></script>
<script src="javascript/script.js">
</script>

回答by Ionut Necula

It's because of the jQuery version you use. https://code.jquery.com/jquery-3.1.1.slim.min.js

这是因为您使用的 jQuery 版本。 https://code.jquery.com/jquery-3.1.1.slim.min.js

slimversion of jQuery does not contain all the original jQuery functions.

slimjQuery 版本不包含所有原始 jQuery 函数。

You should use a fullversion. You can download it from here.

你应该使用一个full版本。你可以从这里下载。

It will help to better understand if you read this article from herewhere at some point in it you will find this statement and I quote:

如果您从此处阅读本文,将有助于更好地理解本文, 您会其中找到以下声明,我引用:

Slim build

Finally, we've added something new to this release. Sometimes you don't need ajax, or you prefer to use one of the many standalone libraries that focus on ajax requests. And often it is simpler to use a combination of CSS and class manipulation for all your web animations. Along with the regular version of jQuery that includes the ajax and effects modules, we're releasing a “slim” version that excludes these modules. All in all, it excludes ajax, effects, and currently deprecated code.

苗条身材

最后,我们在此版本中添加了一些新内容。有时您不需要 ajax,或者您更喜欢使用许多专注于 ajax 请求的独立库之一。通常,对所有 Web 动画使用 CSS 和类操作的组合更简单。除了包含 ajax 和效果模块的常规 jQuery 版本外,我们还发布了一个不包含这些模块的“瘦身”版本。总而言之,它不包括 ajax、效果和当前已弃用的代码。

回答by user3669026

slim version will not support some methods hence include this CDN

精简版将不支持某些方法,因此包含此 CDN

<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>

in your project and then run your code it will work.

在您的项目中,然后运行您的代码,它将起作用。