在「菜單」中爲當前頁面添加活動類

我已經創建了文件header.php，它調用了所有頁面中的頁眉部分...現在我想要如果我在頁面上..它將應用兩個類來在菜單中的給定按鈕...我試圖這樣做，但它不能正常工作......請指導我該怎麼辦....在「菜單」中爲當前頁面添加活動類

<?php 
session_start(); 
?> 

<script type="text/javascript"> 
var path = window.location.pathname.split('/'); 
path = path[path.length-1]; 

if (path !== undefined) { 
    $("#menu") 
     .find("a[href$='" + path + "']") // gets all links that match the href 
     .parents('li') // gets all list items that are ancestors of the link 
     .children('a') // walks down one level from all selected li's 
     .addClass('active'); 
} 
</script> 
<script type="text/javascript"> 
var path = window.location.pathname.split('/'); 
path = path[path.length-1]; 

if (path !== undefined) { 
    $("#menu") 
     .find("a[href$='" + path + "']") // gets all links that match the href 
     .parents('li') // gets all list items that are ancestors of the link 
     .children('a') 
     .children('span') // walks down one level from all selected li's 
     .addClass('curant'); 
} 
</script> 

<div id="header"> 
    <h1><a href="home.php"><img src="images/logo.png" width="184" height="77" alt=""></a></h1> 
    <div class="header_left"> 
    <h2>Customer Relationship <span>Management System</span></h2> 
    <div class="PoweredBy"> 
    <h3> PoweredBy:</h3> 
    <div class="PoweredBy_image"><a href="#"><img src="images/PoweredBy-logo.png" alt=""></a></div> 
    </div> 
    </div> 
<div class="menu" id="menu"> 
<div class="menu_leftbg"></div> 
    <div class="nav"> 
    <ul> 

    <li class="home"><a href="home.php"><span><img src="images/home-page.png" alt=""></span></a></li> 
    <li><a href="all_inquiry.php"><span >All Enquiry</span></a></li> 
    <li><a href="booking.php"><span >Book Now</span></a></li> 
    <li><a href="all_booking.php"><span >All Booking</span></a></li> 
    <li><a href="#"><span >Send SMS</span></a></li> 
    </ul> 

    <div class="right_nav"> 
    <h3>Welcome! <?php if(loggedin()){?><span><?php echo $_SESSION['username']; echo $_COOKIE['username']; }?></span></h3> 
<?php if(loggedin()){ ?> <h2><a href="logout.php">Log Out</a></h2><?php } ?> 
    </div> 
    </div> 
    <div class="menu_rightbg"></div> 
</div> 
</div>

來源

2013-03-20 user2182602

不正常......怎麼樣？標記錯誤的元素？吹起你的佈局？踢你的狗？侮辱你的母親？ – 2013-03-20 06:33:34

您需要在dom準備好運行腳本。

$(function(){ 
    var split = window.location.pathname.split('/'); 
    var mnurl = split[split.length-1]; 
    $('#menu a[href="' + mnurl + '"]').addClass("menu-selected").children('span').addClass("curant"); 
})

演示：Fiddle

來源

2013-03-20 06:44:42

謝謝你...這段代碼工作完美.. – user2182602 2013-03-20 08:13:34

乾草我想要另一個班級適用於我給標籤的範圍......我已經寫了這個..但它沒有考慮到跨度... $（'＃menu a [href =''+ mnurl +'「]'）。addClass（」active「）; $（'＃menu a span [href =「'+ mnurl +'」]'）。addClass（「curant」）; – user2182602 2013-03-20 08:31:09

哪些類必須被添加到跨度 – 2013-03-20 08:32:22

試試這個：

的Javascript：

$(function() { 
    var mnurl = window.location.href.substr(window.location.href.lastIndexOf("/") + 1); 

    $("ul.menu").each(function() { 
     if ($(this).attr("href") == mnurl) $(this).addClass("menu-selected"); 
    }) 
});

css：

.menu-selected{ color: #ccc !important;}

來源

2013-03-20 06:36:07

在「菜單」中爲當前頁面添加活動類

回答

相關問題