0

私のナビゲーション バーでは、「アクティブ」なクラスをナビゲーション バー リストに追加する必要があります。私の問題は、クラスページを追加した後、アクティブなクラスが再び非表示になることです。助けてください。どうすればよいかわかりません。

HTML

<div class="navigation_part">
    <div id="top-nav">
        <ul>    
            <li class=""><a href="index.php">Home</a></li>                       
            <li class=""><a href="about.php">About&nbsp;Us</a></li>
            <li class=""><a href="entrepreneurs.php">Entrepreneurs</a></li>         
            <li class=""><a href="investors.php">Investors</a></li>
            <li class=""><a href="contactus.php">Contact&nbsp;Us</a></li>   
        </ul>   
        <div class="nav_bar_underline"></div>
    </div>
</div>

Jクエリ

$(document).ready(function() {
// I tried these both but both not working
$('.navigation_part li').on('click', function() {
$(this).addClass('active').siblings().removeClass('active');
});
$('.navigation_part li a').click(function(e) {
e.preventDefault(); // prevent the default action
e.stopPropagation; // stop the click from bubbling
$('.navigation_part li').removeClass('current');
$(this).parent().addClass('current');
});  });

preventDefault()アンカーの href を使用すると機能しません...

4

2 に答える 2

2

JavaScript を使用して現在のページに加えた変更は、別のページに移動すると失われます。ブラウザーは、他のページのメニューに変更を自動的に適用しません (これは、すべての点で異なるメニューです)。

クリックをキャプチャしてページ コンテンツを AJAX で変更する動的システムがない限り、可能性は低いと思われます。

おそらく必要なことを達成する最も簡単な方法は、サーバー側で行うことです.PHPを使用しているように見えるので:

<li class="<?php if( __FILE__ === "index.php" ) echo "actuve"; ?>"><a href="index.php">Home</a></li> 
<li class="<?php if( __FILE__ === "about.php" ) echo "active"; ?>"><a href="about.php">About&nbsp;Us</a></li> 
...etc
于 2013-09-25T08:09:55.560 に答える
0

php を使用すると、より適切に実行できます。次の手順を実行します。

index.php、contactus.php、aboutus.php... などの各ページで、このコードを先頭に追加します。

  <?php $page= basename($_SERVER['PHP_SELF']);
    include ("header.php");
     ?>

header.php が変更されました

<div class="navigation_part">
    <div id="top-nav">
        <ul>    
            <li class="<?php echo ($page == "index.php" ? "active" : "")?>"><a href="index.php">Home</a></li>                       
            <li class="<?php echo ($page == "about.php" ? "active" : "")?>"><a href="about.php">About&nbsp;Us</a></li>
            <li class="<?php echo ($page == "entrepreneurs.php" ? "active" : "")?>"><a href="entrepreneurs.php">Entrepreneurs</a></li>         
            <li class="<?php echo ($page == "investors.php" ? "active" : "")?>"><a href="investors.php">Investors</a></li>
            <li class="<?php echo ($page == "contactus.php" ? "active" : "")?>"><a href="contactus.php">Contact&nbsp;Us</a></li>   
        </ul>   
        <div class="nav_bar_underline"></div>
    </div>
</div>
于 2013-09-25T09:43:17.343 に答える