Bootstrap 3 + backbonejs - 切換導航無法打開

Question

我正在爲我的項目（https://izify.com/）使用jquery，backbonejs，underscorejs和bootstrap 3。這是我的源代碼https://github.com/datomnurdin/izify-template。點擊按鈕後，我無法打開Goog​​le瀏覽器導航欄。

這是toogle nav的屏幕截圖。

我offcanvas.js

$(document).ready(function() { 
    $('[data-toggle=offcanvas]').click(function() { 
    $('.row-offcanvas').toggleClass('active'); 
    }); 
}); 

有當backbonejs集成任何問題嗎？

我把模板從這裏，http://getbootstrap.com/examples/offcanvas/

演示網站：http://staging.revivalx.com/izify-template/

Answer 1

如何ABT this..cleaner方式

define(['jquery', 'underscore','backbone','text!templates/home/homeTemplate.html'], function($, _, Backbone, homeTemplate){ 

var HomeView = Backbone.View.extend({ 
el: $("#page"), 

events: { 
    'click [data-toggle=offcanvas]' :'toggleClass' 
}, 

render: function(){ 
    this.$el.html(homeTemplate); 
}, 

toggleClass: function (e) { 
this.$('.row-offcanvas').toggleClass('active'); 
} 

}); 

return HomeView; 

}); 

Answer 2

我刪除offcanvas.js

$(document).ready(function() { 
    $('[data-toggle=offcanvas]').click(function() { 
    $('.row-offcanvas').toggleClass('active'); 
    }); 
}); 

，並把這個行代碼

$('[data-toggle=offcanvas]').click(function() { 
     $('.row-offcanvas').toggleClass('active'); 
     }); 

成HomeView.js

define([ 
    'jquery', 
    'underscore', 
    'backbone', 
    'text!templates/home/homeTemplate.html' 
], function($, _, Backbone, homeTemplate){ 

    var HomeView = Backbone.View.extend({ 
    el: $("#page"), 

    render: function(){ 
     this.$el.html(homeTemplate); 

        $('[data-toggle=offcanvas]').click(function() { 
        $('.row-offcanvas').toggleClass('active'); 
        }); 
    } 

    }); 

    return HomeView; 

}); 

它工作正常。