問題描述

我正在使用主干+requirejs+jquery，但在我當(dāng)前的 html 頁面中加載 jquery 插件時遇到問題(確切地說是主干 html 模板).

I'm working with backbone+requirejs+jquery and I have a problem with jquery plugin loading in my current html page (backbone html template precisly).

有我需要的配置:

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 頁面中，我有:

In my layout html page I have:

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

在我的模板頁面中，我有:

and in my template page I have:

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

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

最后是我的瀏覽器消息:

Finally my browser mesg :

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

你有什么想法嗎?

同時我還有一個問題，在我們當(dāng)前的頁面中包含一些 js 代碼的最佳方式是什么，包括主干、requirejs 等.

In the same time I have another question, what is the best way to include some js code in our current page with backbone,requirejs, etc.

謝謝:)

推薦答案

我解決了類似的問題(Jquery.cookie)，但我的問題是 Jquery 正在加載，然后 Jquery.cookie 被包含但已經(jīng)需要將 JQuery 作為靜態(tài)資源.

I solved a similar issue (Jquery.cookie) like this, but my problem was that Jquery was being loaded and then Jquery.cookie was being included but require already had JQuery as a Static resource.

像這樣我將 Jquery.Cookie 傳遞給應(yīng)用程序，它只在我的應(yīng)用程序范圍內(nèi)插入 jquery.cookie.

So like this I pass Jquery.Cookie to the application and it inserts jquery.cookie in my application scope only.

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 類中

and then in the main App class I added

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

在此之后我能夠找到 jquery cookie.

After this I was able to find jquery cookie.

順便說一句:如果您使用 Require.js 來獲取它，則無需在 html 中導(dǎo)入 JQuery.camera，除非您在 Require.js 范圍之外使用它.

BTW: there is no need to import JQuery.camera in your html if you are using Require.js to fetch it, unless you use it outside your Require.js scope.

這篇關(guān)于使用帶有 Backbone 和 Requirejs 的 jQuery 插件的文章就介紹到這了，希望我們推薦的答案對大家有所幫助，也希望大家多多支持html5模板網(wǎng)！