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');してから、1つのイベントハンドラーを使用するか、親要素で.on / .liveを使用して、委任されたイベントを許可します。

はどうかと言うと

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

次の兄弟を取得するnextを指定しているため、.commentholderは冗長だと思います。

于 2012-06-15T21:52:55.980 に答える
0

表示と非表示を切り替えるだけの場合は、.toggle（'showorhide'）を使用することをお勧めします

私はあなたが試すための基本的なフィドルを作成しました。

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

うまくいけば、これがお役に立てば幸いです。

于 2012-06-15T22:04:36.577 に答える