2

$menulink をクリックすると、.menu-link 内のスパンのクラスがトグルされるようにしたいと思います。私は以下のコードを試しましたが、うまくいかないので何か間違っています:

$(document).ready(function() {
$('body').addClass('js');
var $menu = $('#menu'),
$menulink = $('.menu-link'),
$arrow = $('.arrow-down');

$menulink.click(function() {
$menulink.toggleClass('active');
$menu.toggleClass('active');
$arrow.toggleClass('visible');
return false;
});});
})();

マークアップ:

<a class="menu-link" href="#menu"><span class="arrow-down"></span><span>Menu</span></a>
<nav role="navigation" id="menu" class="">
<ul class="menu">
<li>stuff</li>
</ul>
</nav>

どんな助けでも大歓迎です！:)

4

5 に答える 5

1

試す

$menulink.find('span').toggleClass('active');

最初のスパンのみが必要な場合

$menulink.find('span:first').toggleClass('active');

arrow-downまたはクラスを持つスパンが欲しい

$menulink.find('span.arrow-down').toggleClass('active');
于 2013-03-07T11:07:43.250 に答える
0 
$menulink.children('span').toggleClass('whatever');

クリック機能の内部。

arrow-downまたは、スパンのみをターゲットにしたい場合

$menulink.children('span.arrow-down').toggleClass('whatever');
于 2013-03-07T11:03:47.403 に答える
0

これを試して

$menulink.children(':first').toggleClass('active');

これは<span>、あなたのケースにある最初の子を見つけます

于 2013-03-07T11:07:25.150 に答える
0

使用するコードは、ページ上のそのクラスを持つすべての要素を切り替えます。これを試して：

$(document).ready(function() {
   $('.menu-link').click(function() {
      $(this).toggleClass('active');
      $(this).children('.arrow-down').toggleClass('visible');
      $('#menu').toggleClass('active');
   });
});
于 2013-03-07T11:08:45.887 に答える
0

アンカー タグであるため$menu-link、ブラウザがページから離れているのではないでしょうか。

あなたの回答が機能しない場合、上記の回答のいずれかが機能する理由がわかりません。

jsfiddle を設定してみてください。

于 2013-03-07T11:08:52.690 に答える