addClass 和 fadeIn 无法正常工作

发布于 2024-12-09 08:21:56 字数 886 浏览 0 评论 0原文

在我的index.php 中，我有四行的表。其中之一包含 INPUT class="sipPacket" 下一个文本下一个 INPUT class="sipPacket" 下一个文本。每两行都在 TBODY 中。

<table>
<tbody>
<tr><td><input class="sipPacket" type="radio" /></td></tr>
<tr><td>Some text 1...</td></tr>
</tbody>
<tbody>
<tr><td><input class="sipPacket" type="radio" /></td></tr>
<tr><td>Some text 2...</td></tr>
</tbody>
</table>

我只是希望当我检查一个单选按钮时，下一个“tbody”中第二个“tr”后面带有文本“Some text 2”的部分被隐藏，反之亦然。我做了这样的事情：

$('.sipPacket')
.live('click',function() {
    if($(this).is(':checked')) {
       $(this).parent().parent().parent().addClass('on').fadeIn().siblings().removeClass('on').children('tr:odd').fadeOut();
    }
});

它隐藏了第二个元素，但当我按下这个隐藏元素上的收音机时，它不会再次显示。

原文

In my index.php I have TABLE with four rows. One of them contains INPUT class="sipPacket" the next TEXT the next INPUT class="sipPacket" the next TEXT. Every two rows are in the TBODY.

<table>
<tbody>
<tr><td><input class="sipPacket" type="radio" /></td></tr>
<tr><td>Some text 1...</td></tr>
</tbody>
<tbody>
<tr><td><input class="sipPacket" type="radio" /></td></tr>
<tr><td>Some text 2...</td></tr>
</tbody>
</table>

I just want that when I check one radio button the part behind the second 'tr' with text "Some text 2" in next 'tbody' was hidden and vice versa.
I did something like this:

$('.sipPacket')
.live('click',function() {
    if($(this).is(':checked')) {
       $(this).parent().parent().parent().addClass('on').fadeIn().siblings().removeClass('on').children('tr:odd').fadeOut();
    }
});

It hides the second element but does not show it again when I press the radio on this hidden element.

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

流云如水 2024-12-16 08:21:56

我相信这会做你想要做的事情（但我不是 100% 确定你想要实现什么，并且很可能有一种更简单的方法！）：

$(".sipPacket").click(function() {
    $(this).closest("tbody").children("tr:eq(1)").fadeIn().end()
        .siblings().children("tr:eq(1)").fadeOut();
});

这是一个工作示例。它使用 closest 获取祖先 tbody （正如问题评论中所述，这比使用 parent().parent() 容易得多code> 等），然后淡入该 tbody 的第二个 tr 子级。然后，它使用 end 返回到原始匹配的元素集（恰好是 tbody），获取该元素的同级元素（只有一个）并最后淡出该同级的第二个 tr 子级。

I believe this will do what you're trying to do (but I'm not 100% sure what you're trying to achieve, and there may well be an easier way!):

$(".sipPacket").click(function() {
    $(this).closest("tbody").children("tr:eq(1)").fadeIn().end()
        .siblings().children("tr:eq(1)").fadeOut();
});

Here's a working example. It gets the ancestor tbody using closest (which, as noted in the comments on the question, is much easier than using parent().parent() etc.), then fades in the second tr child of that tbody. It then uses end to get back to the original matched set of elements (which happens to be the tbody), gets the siblings of that element (there is only one) and finally fades out the second tr child of that sibling.