Require.js和twitter-bootstrap

Question

我已经实现了requi.js-scipt，将twitter-bootstrap放在一个单独的模块中。但是，当我测试它是否像预期的那样工作时，包含一个按钮的页面将打开一个模式对话框，没有任何反应。我猜我必须做更多的工作来将css组件与require-module结合在一起。但我不知道该在哪里换。该模块将“已加载的..”-message打印到控制台，因此到目前为止它似乎还可以工作。

我的模块：

require.config({
    paths : {
        'jquery' : ['extdep/jquery-1-8-3'],
        'bootstrap-modal' : ['extdep/twitter-bootstrap/js/bootstrap-modal']
    },
    shim : {
        'bootstrap-modal' : ['jquery']
    }
});

require(['jquery', 'bootstrap-modal'],
     function($){
         console.log("Loaded :)");    
         return {};
     }
);

Div实现模块的模式对话框和脚本标记。

    <div class="container">
                <h2>Example of creating Modals with Twitter Bootstrap</h2>
                <div id="example" class="modal hide fade in" style="display: none;">
                    <div class="modal-header">
                        <a class="close" data-dismiss="modal">×</a>
                        <h3>This is a Modal Heading</h3>
                    </div>
                    <div class="modal-body">
                        <h4>Text in a modal</h4>
                        <p>You can add some text here.</p>
                    </div>
                    <div class="modal-footer">
                        <a href="#" class="btn btn-success">Call to action</a> <a href="#"
                            class="btn" data-dismiss="modal">Close</a>
                    </div>
                </div>
                <p>
                    <a data-toggle="modal" href="#example"
                        class="btn btn-primary btn-large">Launch demo modal</a>
                </p>
            </div>

<script data-main="main" 
            src="//cdnjs.cloudflare.com/ajax/libs/require.js/2.1.4/require.min.js" />

你知道我错过了什么吗？

Answer 1

你的垫片错了。难道你不应该对jQuery本身也有一个填充程序吗？或者您使用的是专为Require.js而构建的版本？

shim : {
    'jquery':{
        exports: 'jQuery'
    },
    'bootstrap-modal': {
        deps: ['jquery'],
        exports: 'jQuery.fn.modal'
    }
}

Answer 2

我想你需要data-parent="example"在这条线上。

<a data-toggle="modal" href="#example" class="btn btn-primary btn-large">Launch demo modal</a>

但我不是100%。你应该做一个jsfiddle，这样我们就可以玩它了。