jquery - 用jQuery触发表中的鼠标事件（通过父级）？

Question

我有一个问题，我不明白：

我有一个表格，每个单元格都包含一个小的定义列表和一个锚点，所以它看起来像：

<table>
<tr>
    <td>
        <dl>
            <dt>Title</dt>
            <dd>Summary</dd>        
        </dl>
        <a>Link</a>
    <td>
</tr>
</table>

还有更多的行和列，但这应该足够了:-)

如果鼠标进入 dl 或者可能是 td，我想要的是显示隐藏的（使用 .hide()-Method）锚。加上隐藏包含在非“mouseenter”的 td's / dl's 中的所有其他锚点。

我尝试了以下功能：

(function(){
    $('td').on('mouseenter', 'dl', function(){
        ($(this)
            .next());
            .show();
            .slideDown(300)
                .siblings('a')
                    .slideUp(300);

    })  
})();

知道我做错了什么吗？问题可能是，我在运行时创建了动态的表格内容（tr 和向下）吗？我很高兴有任何建议。

Answer 1

采用：

$(this).parent().next().show().slideDown(300).siblings('a').slideUp(300);

Answer 2

像这样的东西应该达到你想要的：

$(function() {  
    $('td').on('mouseenter', function() {  
        $(this).parents('table').find('a').slideUp(300);
        $(this).children('a').slideDown(300);
    });
});

请参阅此处的 jsFiddle > http://jsfiddle.net/WR45L/。

Answer 3

尝试使用我在下面修改的 javascript。看起来代码对我来说是错误的。

(function(){
    $('td').on('mouseenter', 'dt', function(){
        $(this)
            .next()
                .slideDown(300)
            .parent('dl')
                .siblings('a')
                    .slideUp(300);

    })  
})();