为什么它不能通过当前的方法工作？

Question

在html中我有一个div

<div class="row"  id='textdrag{{$index}}'>

我需要使用id来显示基于id的上下文菜单，比如。

$("#textdrag2").contextmenu(function (event) {  
    setcontextposition("text");
});

但由于某种原因，不显示上下文菜单。

当我使用id =＆＃34; textdrag＆＃34;它的工作正常没有$ index

Answer 1

为什么不在课堂上追加，这样你就不会在动态id上有一个片状选择器。使用会改变的选择器通常不是一个好主意。

<div class="row text-drag-cls"  id='textdrag{{$index}}'>

$(".text-drag-cls").contextmenu(function (event) {  
    setcontextposition("text");
 });

希望有所帮助

Answer 2

将您的html更改为以下

<div class="row" id="{{ 'textdrag' + $index }}"></div>

Answer 3

为什么它不能通过当前的方法工作？

基本上，您的javascript在加载后会立即生效，但该实例textdrag{{$index}}尚未评估$index值。由于事件没有附加到该DOM。

我建议您为此功能创建指令，这通常是在AngularJS中使用DOM的可行解决方案。通过这种方法，您不需要为每个元素指定唯一标识符。

<div class="row" context-menu>
   ...
</div>

<强>指令

app.directive('contextMenu', [function(){
   return {
      link: function(scope, element, attrs) {
         element.contextmenu(function (event) {  
            setcontextposition("text");
         });
      }
   }
}])

在js中访问动态ID

3 个答案:

为什么它不能通过当前的方法工作？