私は JQuery の初心者で、addClass() について質問があります。これを機能させるためにしばらく時間を費やしましたが、何か間違ったことをしたようです。HTMLとブートストラップでトップメニューを作成しました。訪問者は最初に index.php にアクセスすると想定しているので、index.php に class="active" を作成しました。次に、トップ メニューの他のリンク (例: About Us) をクリックすると、class="active" が index.php の "li" タブに追加され、class="active" が削除されます。
以下は私のHTMLコードです:
<div class="nav-collapse collapse">
<ul class="nav pull-right">
<li id="home" class="active"><a href="index.php"> Home</a></li>
<li id="about"><a href="about_us.php"> About Us</a></li>
<li id="browse"><a href="browse.php"> Browse</a></li>
<li id="contact"><a href="contact.php"> Contact</a></li>
</ul>
</div>
以下は、私が使用してこれを実現しようとする JQuery コードです。
$(function (){
var sidebar = $('.nav');
sidebar.delegate("li", "click", function(){
if($(this).hasClass('active')){
//If click on the tab that is currently active, it will do nothing.
}else{
sidebar.find('.active').addClass('inactive');
sidebar.find('.active').removeClass('active');
$(this).removeClass('inactive');
$(this).addClass('active');
}
});
});
ローカルサーバーでテストしました。トップメニューのタブをクリックするとグレーに変わりましたが、そのままではありませんでした。だから私は何か間違ったことをしたと確信していますが、どこにあるのかわかりません。私は JQuery の初心者なので、皆さんから学べることを願っています。ありがとう!