Javascript Fancybox 不是函数

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/3992054/
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 07:03:29  来源:igfitidea点击:

Fancybox is not a function

javascriptjqueryhtmljquery-pluginsfancybox

提问by macha

Hello I am using the jQuery plugin fancybox to display bing maps when somebody enters an address into a textbox and hits the submit button beside it. And a fancybox is loaded and a map for that address is displayed. This is working well with my application, but the problem is, it is only working well on one page and on the other one, when I load it, it is giving me an error saying fancybox is not a function. I get to see this error in the error console and in the firebug console. I am not sure what could the problem. The same code works in another page, but it doesn't on this one?

您好,当有人在文本框中输入地址并点击旁边的提交按钮时,我正在使用 jQuery 插件fancybox 来显示 bing 地图。并加载一个fancybox并显示该地址的地图。这在我的应用程序中运行良好,但问题是,它只能在一个页面上运行良好,而在另一个页面上,当我加载它时,它给我一个错误,说fancybox 不是一个函数。我在错误控制台和萤火虫控制台中看到了这个错误。我不确定是什么问题。相同的代码在另一个页面上有效,但在这个页面上不起作用?

$("<a href=\"#showmap\">Map</a>").fancybox is not a function

I am pretty sure it is not re-usability issue. But when I test to see if fancybox's original files have been loaded, they are loaded with the dom, so it might not be actual problem. But I am unable to understand what else could the problem be.

我很确定这不是可重用性问题。但是当我测试fancybox的原始文件是否已加载时,它们与dom一起加载,因此可能不是实际问题。但我无法理解还有什么问题。

This is my code

这是我的代码

abbr: is just a text bit. I have different divs based on what the user selects. And each div would have its own controls, which would start with that text and are appended with their own definitions such as mapresults, decValLat, decValLon etc.

abbr:只是一个文本位。根据用户的选择,我有不同的 div。每个 div 都有自己的控件,这些控件将从该文本开始,并附加有自己的定义,例如 mapresults、decValLat、decValLon 等。

ex: abbr>>east and then the ids would be eastmapresults, eastdecValLat, eastdecValLon etc.

例如: abbr>>east 然后 id 将是eastmapresults、eastdecValLat、eastdecValLon 等。

function showMapFancybox(abbr){
    var abbr;
    $('#'+abbr+'mapresults').hide(); 
    $('<a href="#showmap">Map</a>').fancybox({
        overlayShow: true,
        onClosed: function() {
            $('#'+abbr+'mapresults').show();
            map_latdec = $('#decValLat').attr('value');
            map_longdec = $('#decValLon').attr('value');
            map_latdeg = $('#degValLat').attr('value');
            map_longdeg = $('#degValLon').attr('value');

            $('#'+abbr+'decValLatsub').val(map_latdec);
            $('#'+abbr+'decValLonsub').val(map_longdec);
            $('#'+abbr+'degValLatsub').val(map_latdeg+'N');
            $('#'+abbr+'degValLonsub').val(map_longdeg+'W');
        }
    }).click();    
};

回答by Guillaume86

I already had this type of errors because i was reloading jQuery after the plugin import, check you don't reimport jquery by mistake (sometimes included in a package like jQuery tools).

我已经遇到了这种类型的错误,因为我在插件导入后重新加载了 jQuery,请检查您是否错误地重新导入了 jquery(有时包含在像 jQuery 工具这样的包中)。

回答by Wyck

I just had this issue, it seem some versions of jQuery are not compatible with versions of FancyBox, for example Fancybox 1.3.4 is buggy with jQuery versions below 1.7 and doesn't work on version higher than 1.8.

我刚刚遇到了这个问题,似乎某些版本的 jQuery 与 FancyBox 的版本不兼容,例如 Fancybox 1.3.4 在 jQuery 版本低于 1.7 时有问题,并且在高于 1.8 的版本上不起作用。

回答by doublejosh

You need to load the extensions like easing.js and mousewheel.js BEFOREthe main fancybox plugin. That solves the problem.

你需要在主要的fancybox插件之前加载诸如easing.js和mousewheel.js之类的扩展。这解决了问题。

回答by T.Todua

Possible Solutions:

可能的解决方案:

1) have you already loaded jQuery? If not, then load it before any $commands start.

1) 你是否已经加载了 jQuery?如果没有,则在任何$命令开始之前加载它。

2) Check, probably you are loading jquery library (.js) several times during the page. Try to load only one.

2)检查,可能您在页面期间多次加载jquery库(.js)。尝试只加载一个。

3) In the end of file, you can execute this javascript command: $ = jQuery.noConflict();and it might solve. If not, then anywhere use the word jQueryinstead of $, and it will work too.

3)在文件末尾,你可以执行这个javascript命令:$ = jQuery.noConflict();它可能会解决。如果没有,那么在任何地方都可以使用jQuery而不是$,它也可以使用。

回答by Moses

If "fancybox" as a function does not exist, it is likely that either the jQuery source or the plugin source are failing to load into your page. Make sure that the pathing, file names, and extension are all correct.

如果作为函数的“fancybox”不存在,则 jQuery 源或插件源可能无法加载到您的页面中。确保路径、文件名和扩展名都正确。

EDIT:Make sure that you link to jQuery Source before you link to any plugins. If a plugin is loaded into your HTML before jQuery is, the plugin fails.

编辑:确保在链接到任何插件之前链接到 jQuery Source。如果插件在 jQuery 之前加载到您的 HTML 中,则该插件将失败。

回答by GRY

If you are using a plugin which includes JQuery into your header tag, this trouble can arise. I recently added 'TheThe Slider' to my blog, all my FancyBoxes stopped working. There are easy fixes for this situation though. basically, go to the plugin directory, search for the call to jquery and make it's usage conditional. If you would like to see my implementation of this I did blog about itwith screen-capture.

如果您使用的插件将 JQuery 包含在您的标头标记中,则可能会出现此问题。我最近在我的博客中添加了“The Slider”,但我所有的 FancyBox 都停止工作了。不过,这种情况有一些简单的解决方法。基本上,转到插件目录,搜索对 jquery 的调用并使其成为有条件的使用。如果你想看看我的实现,我用屏幕截图写了一篇关于它的博客

回答by Uli

In my case it was jQuery.noConflict(); row in another jQuery plugin ... when I removed everything started to work.

就我而言,它是 jQuery.noConflict(); 排在另一个 jQuery 插件......当我删除一切开始工作。

回答by Shanaka

I got this issue in my WordPress web site and I found the issue was happening due to fancybox.jspresenting twice in the code from two plugins which I installed. So check your code and make sure to load from one source.

我在我的 WordPress 网站上遇到了这个问题,我发现这个问题是由于fancybox.js在我安装的两个插件的代码中出现了两次。因此,请检查您的代码并确保从一个源加载。