jQuery“$(...).effect 不是函数”
Posted
技术标签:
【中文标题】jQuery“$(...).effect 不是函数”【英文标题】：jQuery "$(...).effect is not a function" 【发布时间】：2014-03-26 07:27:04 【问题描述】：我已经在论坛中搜索过，但找不到任何方法来解决我在 jQuery 中的“效果”功能所遇到的问题。
我在代码中得到了错误TypeError: $(...).effect is not a function：
$('div.step').removeClass('active');
$("div.step").effect('slide', direction: 'right', mode: 'hide', 500);
$('#step' + step + '').addClass('active');
$('#step' + step + '').effect('slide', direction: 'right', mode: 'show', 500);
我在<head></head> 中包含了这样的 jQuery 和 jQuery UI：
<script src="http://code.jquery.com/jquery-1.10.2.js"></script>
<script src="http://code.jquery.com/ui/1.10.4/jquery-ui.js"></script>
但徒劳无功，你有什么想法吗？谢谢
【问题讨论】：
你能在jsfiddle复制这个吗？ 你还有其他插件吗？ 这是 jsfiddle ：jsfiddle.net/gYP9m 除了由一些$().fdatepicker()... 在同一个 document.ready 中触发的日期选择器之外，我没有包含任何其他插件。谢谢
我也遇到了同样的问题，只用了一个 jquery 库就解决了。所以不要覆盖它
【参考方案1】：
添加 jQueryUI 而不仅仅是 jQuery。 jQuery 不包含 effect() 函数：
https://code.jquery.com/ui
【讨论】：
【参考方案2】：对我来说，事实证明我的项目使用的是 Jquery-UI 的“自定义下载”版本，该版本已设置为排除 effects 插件。用完整版替换我的 Jquery UI 版本解决了我的问题。
【讨论】：
【参考方案3】：我不知道问题是否解决了，但我找到了一种方法来复制带有动画功能的摇动功能，它就像一个魅力：
function shake()
var div = document.getElementById('yourElementID');
var interval = 100;
var distance = 10;
var times = 4;
$(div).css('position', 'relative');
for (var iter = 0; iter < (times + 1) ; iter++)
$(div).animate(
left: ((iter % 2 == 0 ? distance : distance * -1))
, interval);
$(div).animate( left: 0 , interval);
这个解决方案属于thisSite，所有功劳归于他们。 我希望这对将来的某人有用，如果有，请将其标记为解决方案，问候。
【讨论】：
【参考方案4】：尝试使用
$(document).ready(function ()
$('div.step').removeClass('active');
$("div.step").effect('slide', direction: 'right', mode: 'hide', 500);
$('#step' + step + '').addClass('active');
$('#step' + step + '').effect('slide', direction: 'right', mode: 'show', 500);
【讨论】：
【参考方案5】：您需要将自定义脚本放在 jQuery 和 jQuery UI 声明之后，并将其包装在一个文档 ready() 函数中：
<body>
...
<script src="http://code.jquery.com/jquery-1.10.2.js"></script>
<script src="http://code.jquery.com/ui/1.10.4/jquery-ui.js"></script>
<script type="text/javascript">
$(document).ready(function()
...
);
</script>
</body>
【讨论】：
这就是我所做的，检查上面的 jsfiddle 以查看我编码的内容。谢谢 @mentinet 您没有在 JSFiddle 示例中包含 jQuery UI。它可以正常工作：jsfiddle.net/JamesD/gYP9m/1. 好的，我可以看到。但是代码和我的一模一样，我包含了 jQuery UI……虽然它在我的机器上不起作用。你是如何在 jsfiddle 中包含 jQuery UI 的？ 点击侧边栏中的外部资源并粘贴 URL。 好的，谢谢，它有效。虽然，我仍然无法让它在我的机器上运行。我尝试将$(document).Ready() 也放入head 中（我的页脚文件中有它）但仍然无法正常工作。以上是关于jQuery“$(...).effect 不是函数”的主要内容，如果未能解决你的问题，请参考以下文章