requireJS 与 JQuery、Masonry 和 ImagesLoaded:对象 [object Object] 没有方法“imagesLoaded”

2024-02-02

这里是 RequireJS 新手。尝试将一些我以前工作正常的 JQuery 代码转换为使用 RequireJS 工作。

我的页面标题通过脚本标签加载三个 JS 文件—— require.js 本身、我的 require.cfg.js 和具有站点特定功能的 boot/main.js。

相关 require.cfg.js 摘录:

,paths: {
    'boot': 'src/boot'
    ,'jquery': 'lib/jquery.min'
    ,'jquery.masonry': 'lib/plugins/masonry.pkgd.min'
    ,'jquery.imagesloaded': 'lib/plugins/imagesloaded.pkgd.min'
}

,shim: {
    'jquery': {
        exports: 'jQuery'
    }
    ,'jquery.masonry': ['jquery']
    ,'jquery.imagesloaded': ['jquery']
}

启动/main.js:

require([
'jquery',
'jquery.masonry',
'jquery.imagesloaded',
], function($) {

    // The following code worked just fine when I included it in the header of the page as-is
$(function() {

    var $container = $('#container');
    // This doesn't work
    $container.imagesLoaded(function() {
                    // Neither does this
            $('#container').masonry({itemSelector : '.item',});
        });

});

});

我可以确认浏览器正在找到并加载所有这些 JS 文件。我确认如果我这样做:

require([
'jquery',
'jquery.masonry',
'jquery.imagesloaded',
], function($, Masonry, ImagesLoad) {

Masonry 和 ImagesLoaded 变量设置正确......但我不想在没有 jQuery 的情况下继续

但是当我尝试在 JQuery 容器对象上调用 .imagesLoaded() 和 .masonry() 时,我得到:

未捕获的类型错误:对象 [object Object] 没有方法“imagesLoaded”

如果我注释掉 imagesLoaded 行,我会得到:

未捕获的类型错误:对象 [object Object] 没有方法“masonry”

不确定我在这里做错了什么......?从我在其他 StackOverflow 问题中读到的内容来看,代码对我来说看起来是正确的......?

Thanks!

Update:

如果我像这样以非 JQuery 方式使用此代码,它会起作用:

        var container = document.querySelector('#container');
        imagesLoaded(container, function() {
            var msnry = new Masonry( container, {
                itemSelector: '.item',
            });
        });

也尝试为垫片中的每个插件定义导出...

, paths: {
    boot: 'src/boot'
    , jquery: 'bower_components/jquery'
    , masonry: 'bower_components/masonry',
    , imagesloaded: 'bower_components/imagesloaded'
}
, shim: {
    jquery: {
        exports: 'jQuery'
    }
    , masonry: {
        deps : ['jquery'],
        exports : 'jQuery.masonry'
    }
    , imagesloaded: {
        deps : ['jquery'],
        exports : 'jQuery.imagesLoaded'
    }
}
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

requireJS 与 JQuery、Masonry 和 ImagesLoaded:对象 [object Object] 没有方法“imagesLoaded” 的相关文章

  • 如何使用 javascript/jquery/AJAX 调用 Django REST API?

    我想使用 Javascript jQuery AJAX 在前端调用 Django Rest API 请求方法是 POST 但当我看到 API 调用它的调用 OPTIONS 方法时 所以 我开始了解access control allow o
  • 循环遍历元素并逐步为每个元素应用 CSS 规则

    我有一个网格布局 每个网格布局中都有不同数量的元素 我想动态添加内联grid column通过循环遍历 div 中存在的每个元素的 CSS 规则 ul 与一类 list 所以 HTML 代码的输出需要是 ul class list ul u
  • 如何打开弹出窗口并用父窗口中的数据填充它?

    如何使用 JavaScript jQuery 使用父页面中 JS 变量的数据填充弹出窗口 在我的示例中 我有一个文件名数组 我在父窗口中最多列出五个 如果还有更多 我想提供一个链接来打开弹出窗口并列出数组中的每个帖子 因此 如果我打开一个包
  • 当复选框条件更改时,如何使用ajax更新mysql数据库?

    我有一个在客户端按行显示的文章表 每篇文章都有一个唯一的 ID 并包含一个复选框以指示该文章是否被选中为收藏夹 如果它是最喜欢的 则该复选框已被选中 如果没有 则未选中 现在 如果特定于每一行的复选框条件发生变化 我需要 js 或 jque
  • 将 RequireJS 与遗留代码结合使用

    我正在处理一个非常大的项目 该项目使用 包含带有脚本标记的 javascript 文件的旧版 JSP 页面 使用其他 javascript 模块而不使用 RequireJS 的骨干模型和视图 现在 我们希望开始将 RequireJS 与 j
  • ASP.NET MVC 4 中的 Toast 通知

    我想在用户使用 Toastr 插件单击 添加到购物车 按钮时显示通知 基本上 当用户单击按钮时 它会执行 AddToCart 操作 然后重定向到索引页面 当页面显示时 它会检查 TempData 值 然后显示通知 这是控制器 public
  • jquery上传完成后重定向到新页面

    我正在尝试让这个 jquery 工具与我的网站一起使用以进行文件上传 https github com blueimp jQuery File Upload https github com blueimp jQuery File Uplo
  • PHP、jQuery 和 Ajax 调用乱序

    我正在使用 jQuery 进行 Ajax 调用 我有 x 数量的 Ajax 调用附加到 div 这些 Ajax 加载请求是由 PHP foreach 循环生成的 问题是它们渲染的顺序不正确 它们被设置在数组中
  • 如何使用 jQuery 进行同步请求?

    为什么不返回该函数的responseText function LoadBookmarksAsXml return ajax type GET async false url http www google com bookmarks ou
  • IE 7 兼容模式中的 JQuery Unobtrusive 验证导致带有表单的页面出现“Member Not Found”错误

    最近 我在 Internet Explorer 中查看我的网站时注意到 JQuery 错误 该错误是源自 JQuery 源的 未找到成员 错误 我注意到单击了兼容模式按钮 取消单击此按钮修复了错误 但我不能假设我的网站的用户会如此乐于助人
  • 如何处理 AJAX 请求中的会话超时

    我相信你们都熟悉使用 AJAX 的投票系统 嗯 看那边 我有类似的东西 当你投票赞成或反对时 它使用 AJAX 从 votes php 请求新值 问题是我正在使用会话来获取用户 ID 因此一个人只能投票一次 如果他们在页面上坐了一个小时然后
  • 通过 jQuery 选择动态 HTML 元素

    我正在构建一个 ASP NET MVC 应用程序 并且正在使用jQuery Blueimp https github com blueimp jQuery File Upload动态添加到页面的 PartialView 上的插件 根据插件的
  • 当覆盖设置为 null 时,通过外部单击关闭 fancybox

    我正在使用 fancybox 2 1 4 插件 它工作得很好 但我有一个问题 我想将覆盖设置为空 并且当用户单击 fancybox 容器外部 时关闭 fancybox 我已经尝试过以下代码 但它不起作用 因为没有可供单击的覆盖层 fancy
  • 自定义 jQuery 验证 .addMethod

    我有一个表单 可以根据最小 最大长度验证邮政编码 我需要将所有国家 地区的邮政编码最小设置为 5 位数字 澳大利亚除外 澳大利亚需要为 4 位数字 这是我遇到的问题 validator addMethod AusZip function v
  • JQuery Datepicker OnSelect 和 TextChanged 问题

    自从将 OnSelect 添加到我的 Datepicker 后 该控件不再触发 TextChanged 事件 我的代码如下 function datepicker minDate 0 dateFormat dd M yy onSelect
  • 如何在通过 .ajaxForm() 提交表单之前执行一些操作?

    我正在使用 ajaxForm 框架来发送我的数据 而无需重新加载我的页面 ReplayForm ajaxForm success function data alert Success 现在 我想在提交表单之前检查一些条件 如果条件为假 则
  • 使用 jQuery Select2 清除下拉菜单

    我正在尝试使用奇妙的方式以编程方式清除下拉菜单Select2 http ivaynberg github com select2 图书馆 使用 Select2 远程 ajax 调用动态填充下拉列表query option HTML
  • 水平滚动的表格上的“粘性”标题......完全不可能?

    经过过去几个小时的研究后 我开始认为这是不可能的 即使在最新的浏览器上也是如此 HTML table具有水平滚动的元素 带有 粘性 thead在顶部 作为垂直滚动的周围网页的一部分 这是我的尝试 a height 100px backgro
  • .live() 或 .livequery()

    我有一个Ajaxed的网站 Ajax的内容来自其他页面 例如about html contact html ajax 从名为 main content 的 div 获取内容 但是在 ajax 调用之后 我的其余脚本就中断了 比如tinysc
  • JQuery:将 FormData 和 csrf 令牌一起发布

    Is the data 下面的行正确吗 我想将表单数据和 csrf 令牌发布到 Django 视图函数 file upload on change function var currentpath window location pathn

随机推荐