Làm cách nào để thêm lớp đang hoạt động vào siêu liên kết mã hóa?

Question

Tôi biết câu hỏi này xuất hiện rất nhiều, nhưng tôi không thể tìm ra cách để làm điều này bằng cách sử dụng các bài viết đã trả lời.

Tôi có tiêu đề có liên kết điều hướng. Tôi muốn thêm class="active" vào liên kết đang hoạt động tại thời điểm này.

Tôi làm cách nào để thực hiện điều này nếu tôi có điều hướng sau?

<nav> 
    <ul id="main_nav"> 
     <li class="home"> 
      <a href="search"> 
       <i class="icon-search"></i> 
       <span>BEDRIJF ZOEKEN</span> 
      </a> 
     </li> 
     <li class="categorie"> 
      <a href="categorieen/all"> 
       <i class="icon-list-ul"></i> 
        <span>CATEGORIE</span> 
      </a> 
     </li> 
     <li class="aanbieding"> 
      <a href="aanbiedingen"> 
       <i class="icon-shopping-cart"></i> 
        <span>AANBIEDING</span> 
      </a> 
     </li> 
     <li class="vacature"> 
      <a href="vacatures"> 
       <i class="icon-copy"></i> 
       <span>VACATURE</span> 
      </a> 
     </li> 
     <li class="agenda"> 
      <a href="agenda"> 
       <i class="icon-calendar"></i> 
       <span>AGENDA</span> 
      </a> 
     </li> 
     <li class="contact"> 
      <a href="contact"> 
       <i class="icon-envelope"></i> 
       <span>CONTACT</span> 
      </a> 
     </li> 
    </ul> 
</nav> 

tôi đã cố gắng này, nhưng nó đã không làm việc:

<script> 
$(function() { 
    var href = $(this).find('a').attr('href'); 
    alert(window.location.pathname) 
    if (href === window.location.pathname) { 
     $(this).addClass('active'); 
    } 
}); 
</script> 

Có thể có một cách CodeIgniter-ish tốt hơn?

Answer 1

hãy thử điều này.i nghĩ rằng không cần javascript hoặc jquery.

Nếu bạn đang sử dụng trình mã hóa thì bạn có thể sử dụng Lớp URI.

<li class="home"> 
    <a class="<?php if($this->uri->segment(1)=="search"){echo "active";}?>" href="<?=base_url('search')?>"> 
     <i class="icon-search"></i> 
     <span>BEDRIJF ZOEKEN</span> 
    </a> 
</li> 

xin vui lòng cho tôi biết nếu bạn gặp phải bất kỳ vấn đề

Answer 2

if (href === window.location.pathname) { 
    $('a[href='+ href +']').addClass('active'); 
} 

Answer 3

Hãy thử điều này một:

<a class="<?=(current_url()==base_url('search')) ? 'active':''?>" href="<?=base_url('search')?>"> 

Answer 4

Tôi tạo ra một helper và lưu vào thư mục helper tên là "menu_helper.php":

<?php 
if(!defined('BASEPATH')) exit('No direct script access allowed'); 

if(!function_exists('active_link')) { 
    function activate_menu($controller) { 
    // Getting CI class instance. 
    $CI = get_instance(); 
    // Getting router class to active. 
    $class = $CI->router->fetch_class(); 
    return ($class == $controller) ? 'active' : ''; 
    } 
} 

Sau đó, trong config/autoload.php Tôi thêm "menu" làm người trợ giúp trong dòng 91.

Bước cuối cùng là đặt mã cho in lớp "hoạt động" khi truy cập vào trang (ví dụ: Đăng nhập Trang):

<li class="<?php echo activate_menu('login'); ?>">  
    <?php echo anchor('login', 'Login'); ?> 
</li>