【问题标题】:jQuery is not working with ChaplinjQuery 不适用于卓别林
【发布时间】:2013-07-01 09:19:33
【问题描述】:

我正在使用一些 Backbone 框架 - 卓别林,我正在使用以下文件列表:

以下是 main.js 中的部分代码块:

paths: {
        jquery: 'vendors/jquery/jquery',
        underscore: 'vendors/underscore/underscore',
        backbone: 'vendors/backbone/backbone',
        chaplin: 'vendors/chaplin-0.9.0',        
        bootstrap: 'vendors/bootstrap/js/bootstrap.min',        
        jqTriggers: 'lib/jquery-triggers'
    },

shim: {
        underscore: {
            exports: '_'
        },
        backbone: {
            deps: ['jquery','underscore'],
            exports: 'Backbone'
        },
        bootstrap: {
            deps: ['jquery']
        },        
        jqTriggers: {
            deps: ['jquery']
        }
    } 

以下是 jquery-triggers.js 中的内容

define(['jquery'], function($) {

   $('.dropdown-toggle').dropdown(); 

});

以下是使用 Bootstrap 框架的模板文件的代码块:

<div class="navbar navbar-inverse nav">
        <div class="navbar-inner">
            <div class="container">
                <a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                </a>
                <a class="brand" href="/">Project Name</a>

                <div class="nav-collapse collapse">
                  <ul class="nav">
                      <li class="divider-vertical"></li>
                      <li><a href="#"><i class="icon-home icon-white"></i> Home</a></li>                      
                  </ul>
                  <div class="pull-right">
                    <ul class="nav pull-right">
                        <li class="dropdown"><a href="#" class="dropdown-toggle" data-toggle="dropdown">Welcome, User <b class="caret"></b></a>
                            <ul class="dropdown-menu">
                                <li><a href="/user/preferences"><i class="icon-cog"></i> Preferences</a></li>
                                <li><a href="/help/support"><i class="icon-envelope"></i> Contact Support</a></li>
                                <li class="divider"></li>
                                <li><a href="/auth/logout"><i class="icon-off"></i> Logout</a></li>
                            </ul>
                        </li>
                    </ul>
                  </div>
                </div>
            </div>
        </div>
    </div>

问题:下拉菜单不工作。

我猜! jquery-triggers.js 未加载。因为我看不到它分别加载到 Chrome / firefox firebug network / net 上。

我尝试在包含 require.js 之后在我的 index.html 页面中包含 jquery-triggers.js 文件,但由于 jquery-triggers.js 文件被提前加载,它没有工作。

【问题讨论】:

  • 根据jqTriggers试试
  • 我试过了,但没用
  • define(['jqTriggers'], function(jqTriggers) { $('.dropdown-toggle').dropdown(); });但这也不起作用。
  • 遇到任何错误?真的,您应该将 jqueryjqTriggers 作为依赖项传递。
  • 我也会提出同样的建议。 jqTriggers 没有被加载的原因是因为你没有在任何地方使用它!带有垫片的define(['jqTriggers'], ...) 应该通过加载jQuery 后跟jqTriggers 来解决这个问题。如果没有任何进一步的信息,除此之外很难进行调试。

标签: twitter-bootstrap backbone.js requirejs chaplinjs


【解决方案1】:

将 jqTriggers 传递到整个应用程序所需的数组中。

然后它将被加载到任何地方。

require(['application', 'routes', 'jqTriggers'], 
  function (Application, routes) {
     var app = new Application({
     routes: routes,
     controllerSuffix: '-controller'
   });          
});

【讨论】:

    猜你喜欢
    • 2012-06-11
    • 1970-01-01
    • 2013-04-11
    • 2022-12-10
    • 2021-03-13
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多