需要js带有CDN jQuery和Fancybox

我是reqire.js的新手，我无法使Fancybox与Google CDN JQuery一起使用。

我的文件结构是：

index.html/
├── js/
│   ├── app.js
│   ├── app/
│   |   ├── main.js
│   ├── lib/
│   |   ├── require.js
│   |   ├── jquery.fancybox.js
│   |   ├── jquery.fancybox-thumbs.js
│   |   ├── jquery.fancybox-media.js
│   |   ├── jquery.mousewheel-3.0.6.pack.js

app.js

requirejs.config({
    "baseUrl": "js/lib",
    "paths": {
      "app": "../app",
      "jquery": "//ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min",
      "jquery.fancybox": "jquery.fancybox",
      "jquery.fancybox-thumbs": "jquery.fancybox-thumbs",
      "jquery.fancybox-media": "jquery.fancybox-media",
      "jquery.mousewheel-3.0.6.pack": "jquery.mousewheel-3.0.6.pack"
    }
});
requirejs(["app/main"]);

main.js

define(["jquery", "jquery.fancybox-media", "jquery.fancybox-thumbs", "jquery.fancybox", "jquery.mousewheel-3.0.6.pack"], function ($) {
    $(function() {
        $('.fancybox').fancybox();
    });
});

html

<head>
        <script data-main="js/app" src="js/lib/require.js"></script>
    </head>
    <body>
        <a class="fancybox" href="myImage.jpg" data-fancybox-group="gallery" title="">
            <h5>Click</h5>
        </a>
    </body>

我仍在发现未定义的jQuery错误。我可以在DOM上看到我的花式盒库和jQuery，但什么也不会发生。

您可能需要按照此处记录的" fancybox文件"。

类似：

requirejs.config({
    baseUrl: 'Scripts',
    paths: {
        "app": "../App",
        "jquery": 'jquery-3.1.1' //Or use cdn
    },
    shim: {
        "jquery.fancybox": ["jquery"]
    }
});
requirejs(["app/index"]);

您遇到的错误很可能是由于需要尝试同步加载jQuery和Fancybox文件，首先接收Fancybox One（因为它较小），并且由于jQuery文件尚未加载而无法使用它因此错误。

相关内容

最新更新

热门标签：