这可能是一个奇怪的情况,以前没有人曾经历过,但是我是偶然地发布此消息,因为有人知道我不知道的东西。
我正在使用jQuery 2.0.3和AngularJS。
如果我有这样的锚点index.html:
index.html
# index.html <a href="#" class="clickme">Click Me</a> <script type="text/javascript"> $(function() { $('.clickme').click(function() { console.log("click"); }); }); </script>
然后它起作用了,当我单击它时,它输出“ click”。但是,当我将其放入包含该ng- include属性的模板中时,jQuery突然无法启动。如果我将脚本和锚点放在模板内部,则确实会触发。
ng- include
# index.html <div ng-include="'path/to/template.html'"></div> # template.html <a href="#" class="clickme">Click Me</a> <script type="text/javascript"> $(function() { $('.clickme').click(function() { console.log("click"); }); }); </script>
使用使用模板的指令也是如此。这很奇怪,并且一些下拉菜单给我带来了很多麻烦。
有人知道为什么会这样吗?
由于您clickme可能无法在DOM上使用- 而是在加载时由Angular将其推送到DOM中template.html-您需要使用jQuery的事件委托而不是使用.click:
clickme
template.html
.click
$(document).on("click", ".clickme", function() { console.log("click"); });
这将确保jQuery绑定到文档上,然后监视具有clickme该类的元素上的任何click事件。