javascript - 在 Backbone 和 Requirejs 中使用 jQuery 插件

标签 javascript jquery jquery-plugins backbone.js requirejs

我正在使用 backbone+requirejs+jquery,我在当前的 html 页面(确切地说是 backbone html 模板)中加载 jquery 插件时遇到问题。

有我需要的配置:

require.config({

  paths: {
    // ... some code about backbone config
    jquery: '/js/lib/jquery/jquery.min',
    'jquery.camera' : '/js/jquery/jquery.camera'
  },

  shim: {
    // ... some code about backbone config
    'jquery.camera': ['jquery']  
  }
});

在我的布局 html 页面中,我有:

<script type='text/javascript' src='/js/jquery/jquery.camera.js'></script>

在我的模板页面中我有:

<script type="text/javascript">
  jQuery(function() {

    jQuery('#test').camera({
...
</script>

最后是我的浏览器消息:

Uncaught TypeError: Object [object Object] has no method 'camera'

你有什么想法吗?

同时我还有一个问题,在我们当前的页面中使用backbone、requirejs等包含一些js代码的最佳方式是什么

谢谢:)

最佳答案

我像这样解决了一个类似的问题 (Jquery.cookie),但我的问题是 Jquery 正在加载,然后 Jquery.cookie 被包含但要求已经将 JQuery 作为静态资源。

像这样,我将 Jquery.Cookie 传递给应用程序,它仅在我的应用程序范围内插入 jquery.cookie。

require.config({

  paths: {
      'async'           : 'libs/async'
      ,'jquery'         : 'libs/jquery'
      ,'underscore'     : 'libs/underscore'
      ,'backbone'       : 'libs/backbone'
      ,'text'           : 'libs/text'
      ,'jquery.cookie'  : 'libs/jquery.cookie'   // <-- cookie lives here
  }

  ,shim: {
    'jquery': {
      exports: '$'
    }
    ,'underscore': {
      exports: '_'
    }
    ,'backbone': {
      deps: ['underscore', 'jquery'],
      exports: 'Backbone'
    }
    ,'jquery.cookie': {     //<-- cookie depends on Jquery and exports nothing
        deps: ['jquery']
    }
  }
});

然后在我添加的主 App 类中

require([
  'jquery'
  ,'underscore'
  ,'backbone'
  ,'mapApp'
  ,'jquery.cookie'   //<- this is the real trick !!!
],
  function ($, _, Backbone, App) {

在此之后我能够找到 jquery cookie。

顺便说一句:如果您使用 Require.js 获取它,则无需在您的 html 中导入 JQuery.camera,除非您在 Require.js 范围之外使用它。

关于javascript - 在 Backbone 和 Requirejs 中使用 jQuery 插件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/12841199/

相关文章:

javascript - 为什么这个 removeDuplicate 不起作用?

javascript - 通过悬停滑下新文本

jQuery 在悬停时淡出 div。无法选择链接

javascript - 创建具有动态参数的 Jquery 插件以供多次使用

javascript - 根据用户计算机的性能禁用 JavaScript 功能

javascript - 使用sharepointplus时未定义的断码处理

javascript - 如何将图表的 Y 轴放在图表的右侧

javascript - 如何在按钮的onclick事件上以编程方式选择 Material 表的行-React js

javascript - 在另一个函数之前执行一个函数(包含 setInterval)的简单方法

javascript - 如何准备数据字符串但字符串不以null结尾