0

我正在尝试将clickjQuery 中的事件绑定到类的所有实例,包括将在页面加载后创建的事件。

我有以下组件:

HTML

<table id='draft-board'>
    <tbody> 
        <tr id='1'>
            <td class='x'><img src='images/x.png' /></td>
            <td class='check available'><img src='images/checkmark.png' /></td>
            <td class='rank'>1</td>
            <td class='player'>Last, First</td>
        </tr>

. . .

Javascript

/*** this one works fine ***/
$('#draft-board tbody tr').on('click', 'td.x', function() {
    //do something...
    $(this).addClass('undo').removeClass('x');
});

/*** this one doesn't get triggered ***/
$('draft-board tbody tr').on('click', 'td.undo', function() {
    console.log('clicked undo');
    //do something else...
    $(this).addClass('x').removeClass('undo');
});

如您所见,当用户单击带有 class 的表格单元格时x,我do something然后将 classx与 class交换undo这部分工作正常。

不起作用的部分是第二个块,do something else当用户单击带有 class 的表格单元格时,我尝试在其中尝试undo。如您所见,我尝试将“单击的撤消”记录到该块内的控制台中,以查看on('click'...)事件是否甚至被触发......它不是。

我的理解是,live()在 jQuery 中复制折旧函数的新方法是调用.on()父元素,然后在方法的参数中传入目标子元素,就像我所做的那样。

但是,显然,undo在页面加载后添加了类的表格单元格没有将该.on()事件绑定到它们。

想法?谢谢你。

4

1 回答 1

3

您在#第二个处理程序上缺少选择器中的 。

$('draft-board tbody tr')->$('#draft-board tbody tr')

于 2013-07-26T20:23:17.147 回答