jquery函数不会从angularjs生成的元素中触发chrome

Question

我很困惑这是怎么发生的。在我将此页面的代码切换为角度生成视图之前，这不是问题，所以我知道这与此有关。问题来自单击通常会触发 jquery 中的函数的 a 标记，这显然首先会阻止默认行为。但是现在该函数从未被调用。这是代码

     <div id="pagingarea" ng-show="maxpage>1">

   <a href="previ" id="first" class="btn btn-info btn-small" ng-show="maxpage>1" ng-click="setpage(1)"><<</a> 
   <a href="previ" id="prev" class="btn btn-info btn-small" ng-click="setpage(currentpage-1)" ng-show="maxpage>1"><</a>    

 <span id="pagerow" ng-show="maxpage>30">
  <a href="prev" id="PrevLink" class="npbtns" >Previous 30</a> 
 <a href="nex" id="NextLink" class="npbtns" >Next 30</a></span>


     <div id="nums">

     <ul class="pagenav" id="pdet">
    <li ng-repeat="p in [maxpage]| forclassic">
      <a href="{{$index+1}}" id="page{{$index+1}}" class="page p30in{{floor($index, 30)+1}}  {{($index>30)? 'hide':''}} {{($index==0)?'currentpage':''}}" ng-click="setpage($index+1)" >{{$index+1}}</a>
     </li>
</ul>


         </div>

      <a href="next"class="btn btn-info btn-small" id="next" ng-click="setpage(currentpage+1)" ng-show="maxpage>1">></a> 
          <a href="last"class="btn btn-info btn-small" id="last" ng-click="setpage(maxpage)" ng-show="maxpage>1">>></a> 
     </div>
          </div> 

由于该问题与控制器中的任何角度代码无关，因此我们假设不需要显示该问题。 jquery 在这里

  $("#pagingarea a").click(function (e) {
  e.preventDefault(); // works in all browsers but chrome
 }

如您所见，我的代码已设置为匹配 jquery 选择器需要选择的内容。最终结果看起来应该是这样，只是一个页码容器，点击后会影响页面上的其他内容，除了 chrome 之外，它对所有内容都如此。

我能收集到的唯一信息是，也许这些元素在 chrome 中的显示方式不同。然而，调试数据清楚地表明它正在按应有的方式生成。

编辑：对于那些好奇的人，我正在使用的 ng-repeat 被修改为使用 [x] 代替集合，因此它可以在这个特定场景中模仿 for 循环而不是 foreach。创建者this cool person

Answer 1

应该这样做：

$("#pagingarea").on('click','a', function (e) {
  e.preventDefault();
  alert('hello world!');
})