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” 的相关文章

  • 禁用输入中的空格,并允许后退箭头?

    我试图禁用用户名文本字段中的空格 但是我的代码也禁用后退箭头 有什么办法也允许后退箭头吗 function var txt input UserName var func function txt val txt val replace s
  • jQuery .append 不起作用

    我想在我的表单中插入一些东西 这些东西被硬编码到插件中 我不想弄乱插件文件 所以我发现 append 我写过类似的东西 据我所知它应该有效 Chrome 中的控制台没有显示任何错误 这是有什么问题吗 由于 wordpress 安全模式 我正
  • 未捕获的类型错误:无法读取未定义的属性“toLowerCase”

    我收到此错误 它源自 jquery 框架 当我尝试加载准备好的文档上的选择列表时 出现此错误 我似乎无法找到为什么会出现此错误 它适用于更改事件 但在尝试手动执行该函数时出现错误 未捕获的类型错误 无法读取未定义的属性 toLowerCas
  • 匹配数组中的对象并合并

    UPDATE 我有一个名为的对象数组cars包含 li 标签 其中包含有关汽车的属性数据 例如价格 汽车类型等 我的目标是 如果这些汽车符合某些标准 则将它们合并到一个列表中 要求 快速性能 保持相同的汽车数组结构 Main Goal Ma
  • Jquery 拖放和克隆

    嗨 我需要实现这个 我有一套可掉落的物品 基本上我是在服装上掉落设计 并且我正在掉落一个克隆 如果我不喜欢删除的对象 设计 我想通过执行隐藏之类的操作来删除它 但我无法做到这一点 请帮我 这是代码 var clone document re
  • Ajax JSON 数据和灯箱冲突

    我有一个带有灯箱插件的画廊设置光廊 http sachinchoolur github io lightGallery docs 该画廊与静态 HTML 完美配合 当我动态抓取 API 数据并尝试让灯箱处理这些项目时 问题就出现了 我似乎无
  • 如何使用JQuery和Django(ajax + HttpResponse)?

    假设我有一个 AJAX 函数 function callpage ajax method get url abc data x 3 beforeSend function success function html IF HTTPRESPO
  • 支持换行的 JQuery 工具提示

    我正在寻找一个轻量级的 jquery 插件 用于在用户将鼠标悬停在元素上时显示工具提示 我希望插件从标题属性中获取内容 而且我可以创建新行也很重要 任何帮助表示赞赏 在 jQuery 1 9 jquery jquery ui 和标准 too
  • 禁用 Bootstrap 中的选项卡

    我正在尝试禁用引导程序中的选项卡 我一直在研究 但尚未找到解决方案 我已经尝试过这个 可以禁用 Bootstrap 中的选项卡吗 https stackoverflow com questions 9237314 can you disab
  • 如何设置视频文件的预览,从输入类型='文件'中选择

    在我的模块之一中 我需要从 input type file 浏览视频 之后我需要在开始上传之前显示选定的视频 我使用基本的 HTML 标签来显示 但它不起作用 这是代码 document on change file multi video
  • 无法正确显示行

    我应该在这个问题的开头说我完全没有 html css javascript 背景 所以请对我宽容点 如果我使用了错误的术语或者问了一个愚蠢的问题 没有提供足够的信息 请抱歉 我正在尝试让一个可扩展的表工作 通过阅读论坛线程 教程 将 nex
  • 是否可以将多个事件处理程序绑定到 JqGrid 事件而不覆盖以前的事件处理程序?

    例如 我在每次页面加载时调用默认设置 并将函数绑定到 loadComplete 来为网格执行一些基本格式化 在某些页面上 我想同时执行其他逻辑 但如果我在网格定义中设置 loadComplete 它将覆盖默认值中设置的函数 有没有办法绑定多
  • JSON 数据中的 jQGrid celledit 显示 URL 未设置警报

    我需要从服务器加载 JSON 并且希望用户能够单击并编辑该值 但是当他们编辑时 它不应该调用服务器 我的意思是我不会立即更新 所以我不想编辑网址 所以我尝试了 ClientArray 但它仍然显示 Url is not set 警报框 但是
  • CORS 在 jquery 中工作正常,但在 angularjs 中不行

    我的服务器端是php mysql 我正在另一个域的 Web 服务中进行 Ajax 调用 其中启用了 的访问控制 var postUrl http logical brains com elance clone test login php
  • 第三个下拉菜单不从数据库填充

    我有以下 Index php
  • 如何删除除任何特定 id 之外的元素

    假设有一个父 id 其中包含许多元素 我想删除除一个元素之外的所有元素 ex parent id children not id n remove
  • JQuery UI Selectable 插件:当 div 溢出时使滚动条不可选择

    我有一个 div 设置为overflow auto 该 div 的内容是可选择的 使用 jQuery UI 当 div 溢出并出现滚动条时 滚动条本身变为可选择状态 因此滚动效果不佳 在 FF Chrome 中 我可以滚动 div 但我得到
  • JavaScript 继承;调用和原型

    要在Javascript中实现继承 通常需要执行以下两个步骤 假设我有一个基类 Animal var Animal function name this name name 我现在想从中派生一个子类 Dog 所以我想说 var Dog fu
  • 覆盖 jQuery 验证 MVC4 中的默认设置

    要覆盖查询验证插件 请在文件 http docs jquery com Plugins Validation validate toptions 推荐的方式是 selector validate invalidHandler functio
  • 如何使用 JavaScript 或 jQuery 克隆 HTML 元素的样式对象?

    我正在尝试克隆元素的样式对象 这应该允许我在更改后重置所述元素的样式 例如 el style left 50px curr style left 50px Modify the elements style The cloned style

随机推荐