0

我正在使用 jquery.panzoom 来包含一个表。

每个表格单元格都采用这种形式： 

<td><div class="cell" id="cell-24-14"></div></td>

该表是动态创建的，因此我使用它来尝试捕获事件： 

$('.cell').on('click', function (e) {        
        alert($(this).attr('id'));
});

我已经尝试删除 div，并直接捕获 td 上的点击，但这也不起作用。
当我捕捉到任何 div 的点击时，我看到表格的容器正在捕捉点击，但点击永远不会到达表格本身（而不是它的单元格）。

如何在 td（甚至 td）内的单个 div 上捕获点击事件？

4

1 回答 1

2

您实际上可以将事件绑定移动到将这些元素添加到 DOM 的函数，如下所示

function appendToDOM(){
   // creating a td element and appending to DOM
    var td = $('<td><div class="cell" id="cell-24-14"></div></td>');
    td.appendTo($table);

   /* now that the element is available in DOM, you can define you event handler here*/

    $('.cell').on('click', function (e) {        
       alert($(this).attr('id'));
    });
}

这种方法的问题是您正在为.cell表中的每个元素定义一个事件处理程序，您可以通过使用委托做得更好。

$('urClosestStaticParent').on('click','.cell',function(e){
    alert($(this).attr('id'));
});

您可以在显示表格之前调用此代码，就像画龙点睛:)

当我说最接近的静态父级时，我指的是您正在创建的动态表的父级，可能是来自文档加载的 div 容器。如果你没有任何这样的元素，你可以尝试在你的 html 中添加一些空的 div，将你的表附加到它并使用它，如果不使用它document。

于 2015-02-05T10:44:45.500 回答