0

http://jsfiddle.net/DfcdQ/

<ol id="nav">
<li><a href="a.php" class="selected">A</a>
  <ol class="child">
  <li><a href="a-1.php">A-1</a></li>
  </ol>
</li>
<li><a href="b.php">B</a>
  <ol class="child">
  <li><a href="b-1.php">B-1</a></li>
  <li><a href="b-2.php">B-2</a></li>
  </ol>
</li>
<li><a href="c.php">C</a>
  <ol class="child">
  <li><a href="c-1.php">c-1</a></li>
  <li><a href="c-2.php">c-2</a></li>
  <li><a href="c-3.php">c-3</a></li>
  <li><a href="c-4.php">c-4</a></li>
  </ol>
</li>
</ol>

子メニューを選択すると、その親メニューも選択されます。以下のコードは子 css では機能しますが、親では機能しません。

var loc = 'c-3.php';

$("#nav a").each(function() {
  $(this).removeClass("selected");
  if (loc.indexOf($(this).attr("href")) != -1) {
      $(this).addClass("selected");
      $(this).parent().addClass("selected"); /* <=== doesn't work :( */
  }
});

これも駄目だ…

$(this).closest('ol').parent().addClass("selected");
4

3 に答える 3

1

あなたは両親について混乱しています、これはうまくいきます：http: //jsfiddle.net/DfcdQ/7/

var loc = 'c-3.php';

$("#nav a").each(function() {
   $(this).removeClass("selected");
   if (loc.indexOf($(this).attr("href")) != -1) {
       $(this).addClass("selected");
       $(this).parent().parent().siblings(':first').addClass("selected");
   }
});​

$(this).parent()を参照します<li><a href="c-3.php">c-3</a></li>、それはを参照していません<a href="c.php">C</a>

于 2012-07-22T09:23:43.333 に答える
0

私はbingjie2680に同意しますが、c.phpアンカーに選択したクラス（bingjie2680ソリューション）またはすべてのアイテムを囲むli（以下）を含めるかどうかによって異なります。

$（this）.parent（）。parent（）。parent（）。addClass（ "selected"）;

于 2012-07-22T09:23:48.807 に答える
0

私は最も近いものに基づいて修正しました。

$(this).closest('ol').parent('li').find('a').addClass("selected");

これが実際のフィデルリンクhttp://jsfiddle.net/DfcdQ/12/です

于 2012-07-22T09:46:43.750 に答える