1

その場所を検索しましたが、自分の状況に合った解決策を見つけることができませんでした。そこで、自分から聞いてみることにしました。これが私がやりたいことです：

  • いずれかを<li>クリックすると、その特定<li>のクラスに「bla」という名前の新しいクラスが与えられ、その他の<li>クラスは「bla」クラスを失います。
  • すでに「bla」クラスがある<li>をクリックすると、「bla」クラスが失われます。
  • 以外のページ上の何か<ul>をクリックすると、「bla」クラスがすべての から削除されます<li>。

HTML:

    <ul>
      <li>Item One</li>
      <li>Item Two</li>
      <li>Item Three</li>
      <li>Item Four</li>
    </ul>

ありがとうございました...

4

2 に答える 2

3

あなたはこれを行うことができます：

$('ul > li').click(function () {
    $(this).toggleClass('bla').siblings().removeClass('bla');
});

$(document).click(function (e) {
    if ($(e.target).closest('ul').length > 0) return;
    $('ul > li').removeClass('bla');
});

フィドルのデモ

于 2013-07-20T18:07:11.750 に答える
0

これらの行で何かをコーディングできます

// Bind a click event on document
$(document).on('click', function (e) {
    // Use e.target to get the element that is currently selected
    var $this = $(e.target);
    // It item is li or not having a class add it 
    if (e.target.nodeName === 'LI' && !$this.hasClass('active')) {
         $this.addClass('active').siblings().removeClass('active');
    } else {
        $('li').removeClass('active');
    }
});

フィドルをチェック

于 2013-07-20T18:04:01.427 に答える