Javascript jquery:$().animate() 不是函数
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/38647190/
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
jquery : $().animate() is not a function
提问by badperson
I've done quite a bit of searching and was not able to find an answer to my question, so here goes.
我已经做了很多搜索,但无法找到我的问题的答案,所以在这里。
I am trying to create a slideout toggle menu with this tutorial, and I'm getting an error slideoutMenu.animate is not a function
我正在尝试使用本教程创建一个滑出式切换菜单,但出现错误slideoutMenu.animate is not a function
here is the html div in question:
这是有问题的html div:
<div id="corner-button"><a href="#" class="slideout-menu-toggle">myLink</a></div>
<div class="slideout-menu">
<h3><a href="#" class="slideout-toggle">Toggle</a></h3>
<ul>
<li>Add new task</li>
<li>See completed tasks</li>
<li>Go to metrics page</li>
</ul>
</div>
and here is my js function:
这是我的 js 函数:
$(document).ready(function(){
$('.slideout-menu-toggle').on('click', function(event){
event.preventDefault();
console.log("in the toggle func");
var slideoutMenu = $(".slideout-menu");
var slideoutMenuWidth = $(".slideout-menu").width();
console.log("width : " + slideoutMenuWidth);
slideoutMenu.toggleClass("open");
if(slideoutMenu.hasClass("open")){
console.log("open....");
slideoutMenu.animate({
left: "0px"
}, 500);
} else {
slideoutMenu.animate({
left: -slideoutWidth
}, 250);
}
});
});
I've tried a number of things, wrapping the above within a straight javascript function and using
我已经尝试了很多东西,将上面的内容包装在一个直接的 javascript 函数中并使用
(function($){
// code here
})
but they all result in the same error. The q's I found related to that issue here on stackoverflow mainly directed users to have 'animate' instead of 'animated' or to make sure they use a jquery obj and not a dom obj.
但它们都会导致相同的错误。我在 stackoverflow 上发现的与该问题相关的 q 主要指导用户使用“动画”而不是“动画”,或者确保他们使用 jquery obj 而不是 dom obj。
Browsed thru quite a few others, but they just variations on what I had already done. tested in firefox and chrome.
浏览了很多其他人,但它们只是我已经做过的事情的变化。在 Firefox 和 chrome 中测试。
when adding a console log statement console.log($.fn.jquery);
I get:
添加控制台日志语句时,console.log($.fn.jquery);
我得到:
3.1.0 -ajax,-ajax/jsonp,-ajax/load,-ajax/parseXML,-ajax/script,-ajax/var/location,-ajax/var/nonce,-ajax/var/rquery,-ajax/xhr,-manipulation/_evalUrl,-event/ajax,-effects,-effects/Tween,-effects/animatedSelector,-deprecated
thanks.
谢谢。
回答by Kevin B
You appear to be using the slim build of jQuery 3.1.0, which doesn't include most of the library. Instead, you should be using the full version.
您似乎在使用 jQuery 3.1.0 的精简版,它不包含大部分库。相反,您应该使用完整版本。