4

これが機能しない理由がわかりません。

$(document).ready(function() {
    if ($('.checkarea.unchecked').length) {
       $(this).parent().parent().parent().parent().parent().parent().parent().removeClass('checked').addClass('unchecked');
}
else {
    $(this).parent().parent().parent().parent().parent().parent().parent().removeClass('unchecked').addClass('checked');
}
});

HTML構造のスクリーンショットは次のとおりです。http://cloud.lukeabell.com/JV9N(正しいスクリーンショットで更新)

また、アイテムの親を見つけるためのより良い方法が必要です(ページにはこれらの要素が複数あるため、チェックされていない要素にのみ影響を与える必要があります)

重要な可能性のある、関連する他のコードを次に示します。

$('.toggle-open-area').click(function() {
        if($(this).parent().parent().parent().parent().parent().parent().parent().hasClass('open')) {
              $(this).parent().parent().parent().parent().parent().parent().parent().removeClass('open').addClass('closed');
          }
          else {
              $(this).parent().parent().parent().parent().parent().parent().parent().removeClass('closed').addClass('open');
          }
    });


    $('.checkarea').click(function() {
        if($(this).hasClass('unchecked')) {
              $(this).removeClass('unchecked').addClass('checked');
              $(this).parent().parent().parent().parent().parent().parent().parent().removeClass('open').addClass('closed');
          }
          else {
              $(this).removeClass('checked').addClass('unchecked');
              $(this).parent().parent().parent().parent().parent().parent().parent().removeClass('closed').addClass('open');
          }
    }); 

(そのセクションの改善にも非常にオープンです)

どうもありがとう!

これがすべて起こっている場所へのリンクは次のとおりです:http://linkedin.guidemytech.com/sign-up-for-linkedin-step-2-set-up-linkedin-student/


アップデート:

コメントからコードを改善しましたが、最初のセクションが機能しないという問題があります。

$(document).ready(function() {
if ($('.checkarea.unchecked').length) {
    $(this).parents('.whole-step').removeClass('checked').addClass('unchecked');
}
else {
    $(this).parents('.whole-step').removeClass('unchecked').addClass('checked');
}
});

-

  $('.toggle-open-area').click(function() {
        if($(this).parents('.whole-step').hasClass('open')) {
              $(this).parents('.whole-step').removeClass('open').addClass('closed');
          }
          else {
              $(this).parents('.whole-step').removeClass('closed').addClass('open');
          }
    });


    $('.toggle-open-area').click(function() {
        $(this).toggleClass('unchecked checked');
        $(this).closest(selector).toggleClass('open closed');
    });


    $('.checkarea').click(function() {
        if($(this).hasClass('unchecked')) {
              $(this).removeClass('unchecked').addClass('checked');
              $(this).parents('.whole-step').removeClass('open').addClass('closed');
          }
          else {
              $(this).removeClass('checked').addClass('unchecked');
              $(this).parents('.whole-step').removeClass('closed').addClass('open');
          }
    }); 
4

2 に答える 2

6

うわー、あなたはclosestまたはparents()方法を使用することができます。

closest( selector )現在の要素から始まり、DOMツリーを上に向かって、セレクターに一致する最初の要素を取得します。

parents( [selector] )一致した要素の現在のセット内の各要素の祖先を取得します。オプションでセレクターによってフィルター処理されます。

于 2012-09-15T21:17:43.577 に答える
1

私は提案します:

$('.toggle-open-area').click(function() {
    $(this).toggleClass('unchecked checked');
    $(this).closest(appropriateSelector).toggleClass('open closed');
});

ちなみに、投稿された画像1にはその特定の要素が含まれていない(そう思われる)ため、代わりに実際のセレクターを提供することはできません。appropriateSelector

参照:


1.質問に実際のマークアップを含めることができることに気づきましたか?その方がはるかに便利で、操作もはるかに簡単です(デモを作成し、タイプミスを修正し、外部サイトが倒れたり、死んだり、コンテンツを再編成したりした場合でも有用性を維持します...)。

于 2012-09-15T21:21:51.160 に答える