Question

我正在尝试使用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');
})

Answer 1

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

至于

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

我认为.commentholder是多余的，因为你在下一步指定了下一个兄弟。

Answer 2

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

我为你创造了一个基本的小提琴。

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

希望这有帮助。

替换类的Jquery事件

2 个答案: