准备功能内的委托功能

时间:2013-10-26 16:32:31

标签: javascript jquery delegation

我正在使用带隐藏行的DataTables插件,在使用分页时,我的点击事件失败,没有控制台错误。

这是功能:

$(document).ready(function() {

$('#datatable tbody td a').on('click', function (e) {
    e.preventDefault();
    var nTr = $(this).parents('tr')[0];
    if ( oTable.fnIsOpen(nTr) ) {
        /* This row is already open - close it */
        $(this).addClass('glyphicon-arrow-down');
        $(this).removeClass('glyphicon-arrow-up');
        oTable.fnClose( nTr );
    } else {
        /* Open this row */
        $(this).addClass('glyphicon-arrow-up');
        $(this).removeClass('glyphicon-arrow-down');
        oTable.fnOpen( nTr, fnFormatDetails(oTable, nTr), 'details' );
    }
});

});

正如您所看到的,我正在使用委托,但该函数包含在ready函数中。我确定这是问题所在。我该如何解决这个问题?

上述问题被错误地询问,请在答案中查看我的评论。

1 个答案:

答案 0 :(得分:2)

阅读.on()

由于元素是动态添加的,因此无法将事件直接绑定到它们。因此,您必须使用Event Delegation

$('#datatable').on('click', 'tbody td a', function (e) {});

语法

$( elements ).on( events, selector, data, handler );

以下代码不是Event Delegation

$('#datatable tbody td a').on('click', function (e) {