0

我正在尝试使用 jQuery 创建一个隐藏/显示按钮。单击 .cminus 时,需要隐藏 .arrowwrap 和 .commentbody 并用 cplus 替换它自己的类。然后,如果单击 .cplus,则需要发生相反的情况。

问题 1:在下面的示例中,将 .cminus 替换为 .cplus 后,.cplus 在单击时不会触发单击事件。

(编辑问题 2 移到单独的票)问题 2:我没有达到 .commentbody 隐藏/显示它的权利

html:

<div class="commentline">
    <div class="carrowholder">
        <div class="cminus"></div>
        <div class="arrowwrap">
        </div>
    </div>
    <div class="commentholder">
        <div class="commenttitle">
            Title
        </div>
        <div class="commentbody">
            Body
        </div>
    </div>
</div>

jQuery代码:

$('.cminus').click(function(e) {
  $(this).next('.arrowwrap').hide();
  $(this).parent().next('.commentholder .commentbody').hide();
  $(this).removeClass('cminus');
  $(this).addClass('cplus');
})

$('.cplus').click(function(e) {
  alert("clicked cplus");
  $(this).next('.arrowwrap').show();
  $(this).addClass('cminus');
  $(this).removeClass('cplus');
})
4

2 回答 2

2

使用.toggleClass('cminus');etc. 然后有一个事件处理程序或在父元素上使用 .on/.live 以允许委托事件。

至于

$(this).parent().next('.commentholder .commentbody').hide();

我认为 .commentholder 是多余的,因为您要指定下一个获得下一个兄弟的下一个。

于 2012-06-15T21:52:55.980 回答
0

如果您只是想在显示和隐藏之间切换,我建议使用 .toggle('showorhide')

我创建了一个基本的小提琴供您尝试。

http://jsfiddle.net/LsWuR/2/

希望这会有所帮助。

于 2012-06-15T22:04:36.577 回答