【问题标题】:TypeError: p.easing[this.easing] is not a functionTypeError: p.easing[this.easing] 不是函数
【发布时间】:2012-09-17 12:30:31
【问题描述】:

当试图用 jQuery 显示一个 div 元素时,我得到了这个错误:

[23:50:35.971] TypeError: p.easing[this.easing] is not a function @ file:///D:/html5%20puzzle/jquery.js:2

相关函数是这样的:

function showWithAnimation(){                  
  console.log('animation called');
  $('#popup').show();
  $("#popup").css({"top": "30%", "left": "30%"})
             .animate({top:(($(window).height()/2)-($('#popup')
             .outerHeight()/2))-70}, 1000, 'easeOutBounce')
             .show();
}

该函数负责显示带有弹跳动画的 div,但是显示了 div 但没有弹跳效果。

编辑:

我正在包括来自 CDN 的 jQuery 和 jQueryUI 库,如下所示(按顺序):

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js'></script>
<script src='http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.5/jquery-ui.min.js'>
</script>

【问题讨论】:

    标签: javascript jquery html


    【解决方案1】:

    您需要为扩展的缓动选项包含 jQueryUI。

    我认为可以选择只在下载中包含缓动,或者至少只包含基本库和缓动。

    【讨论】:

    • 我从 CDN 包含这个文件:&lt;script src='http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.5/jquery-ui.min.js'&gt;&lt;/script&gt; 是这个吗?还是我应该包含另一个文件?
    • 是的,我做到了,但总是遇到同样的问题,请查看我的编辑 :)
    • 哦,我修好了,我在同一个文件中包含了 jQuery-min 和 jQuery,这是我的错误。感谢您的帮助:)))
    • 什么意思?你是怎么解决的?
    • 是的,我仍然遇到同样的错误,但我只包含了一个 jquery 源文件。
    【解决方案2】:

    对于那些有自定义 jQuery UI 构建(例如 bower)的用户,添加位于 ..\jquery-ui\ui\effect.js 的效果核心。

    【讨论】:

    • 我只需要使用一个效果,所以我只需要import "jquery-ui/ui/effects/effect-slide"就可以了。谢谢你的提示,蒂姆!
    【解决方案3】:

    包括这个对我有用。

    请在本节中包含下面提到的行。

    <script src='http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.5/jquery-ui.min.js'>
    

    【讨论】:

      【解决方案4】:

      Jquery easing 插件从 1.2 版本开始重命名了它们的效果函数名称。如果你有一些依赖于缓动的 javascript 并且它没有调用正确的效果名称,它会抛出这个错误。

      【讨论】:

        【解决方案5】:

        我今天尝试在 div 上启动幻灯片效果时遇到此错误。感谢上面“我讨厌懒惰”的回答(我已经赞成),我去寻找一个自定义的 jQuery UI 脚本,事实上你可以直接在 jQuery ui 网站http://jqueryui.com/download/ 上构建你自己的文件。您所要做的就是标记您要查找的效果,然后下载。

        我在寻找幻灯片效果。所以我首先取消选中所有复选框,然后单击“幻灯片效果”复选框,然后页面会自动检查使幻灯片效果工作所需的其他组件。很简单。

        easeOutBounce 是一种缓动效果,您需要选中“Effects Core”复选框。

        【讨论】:

          【解决方案6】:

          如果您使用的是 Bootstrap,那么 Bootstrap 的 jQuery(如果包含在您的 jQuery 脚本标签下方)也可能会用另一个版本覆盖您的 jQuery 脚本标签。包括 jQuery 自己的 CDN 和删除 Bootstrap 提供的 jQuery 脚本标签是唯一对我有用的东西。

          【讨论】:

            【解决方案7】:

            导入jquery.easing cdn 对我有用。

            <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-easing/1.4.1/jquery.easing.min.js"></script>
            

            您可以在网页底部添加。

            【讨论】:

              【解决方案8】:

              对于遇到此错误并且您已尝试更新版本并确保存在效果核心等但仍然摸不着头脑的任何人。检查 animate() 和其他语法的文档。

              我所做的只是写“线性”而不是“线性”并得到 [this.easing] 不是函数

              $("#main").animate({ scrollLeft: '187px'}, 'slow', 'Linear'); //不好

              $("#main").animate({ scrollLeft: '187px'}, 'slow', 'linear'); //好

              【讨论】:

                【解决方案9】:

                我发现了问题:不要使用 CDN(这是导致问题的原因!),而是将 jquery 文件本地保存在您的服务器上,然后问题就消失了。

                【讨论】:

                  【解决方案10】:

                  为 bootstrap 4 及更高版本使用最新的,这不会影响您的 UI

                  【讨论】:

                    【解决方案11】:

                    我发现了一件很奇怪但很重要的事情: 当您安装 jQuery ui (1.12.1) 时,很多缓动工作,例如:

                    jQuery('#my-elm').animate({marginLeft:500},1000,'linear');
                    jQuery('#my-elm').animate({marginLeft:500},1000,'easeOutBounce');
                    

                    有效,但默认:

                    jQuery('#my-elm').animate({marginLeft:500},1000,'swipe');
                    

                    产生很多错误

                    【讨论】:

                    猜你喜欢
                    • 1970-01-01
                    • 1970-01-01
                    • 2014-02-22
                    • 1970-01-01
                    • 2020-06-29
                    • 2020-06-17
                    • 1970-01-01
                    • 1970-01-01
                    • 2020-03-03
                    相关资源
                    最近更新 更多