Javascript jQuery单击函数未触发

我正在尝试将引导布局集成到angular.js项目中。 我已经添加了bootstrap.js和bootstrap.css以及布局自定义css和js。 我的项目中添加了jquery

我面临的问题是没有触发单击处理程序。 这是我的代码：

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

每次页面刷新时都会弹出一个带有“就绪”弹出窗口的弹出窗口，但当我单击具有属性data toggle=“offcanvas”的按钮时，不会弹出任何窗口

我甚至尝试为按钮添加id属性，并在jquery中以按钮为目标，但没有成功：

$('#toggleButton').click(....);

按钮为html，如下所示：

<div class="col-xs-12 col-sm-9">
        <p class="pull-right visible-xs">
             <button type="button" class="btn btn-primary btn-xs" data-toggle="offcanvas">Toggle nav</button>
        </p>

切换导航

出了什么问题

---

提前谢谢。

这对我很有用。您使用的jQuery版本是什么？它的工作原理可能是angular或mean.io的某个东西正在注销单击事件？它也与AngularJS无关：@ExpertSystem，但这是假设OP没有使用angular ajax导入模板的众多方法之一。正确的方法是在指令中执行此操作。Fouad…创建一个复制问题的演示