jQuery addClass đơn giản() dường như không hoạt động

Question

Tôi muốn có thể xác định trang nào người dùng hiện đang sử dụng. một chỉ báo đơn giản dưới dạng thêm kiểu duy nhất vào liên kết điều hướng người dùng hiện đang xem ngữ cảnh của nó

đây là tập lệnh của tôi, tất cả các bộ chọn hoạt động tốt, nếu câu lệnh cũng thực hiện công việc, nhưng hàm addClass() không làm gì cả .. đây là mã của tôi:

<script> 
$(document).ready(function(){ 
    var pathname = window.location.pathname; 
    $("#links ul li a").each(function() { 
     var href= $(this).attr("href"); 
     if (pathname.indexOf(href) >= 0){ 
      $(this).addClass("active"); 
     } 
    }); 
}); 
</script> 


    <nav id="links"> 
    <ul> 
     <li><a href="index.php">Home</a></li> 
     <li><a>About</a></li> 
     <li><a>Contact</a></li> 
    </ul> 
</nav> 

HTML:

nhận nó để làm việc, đây là mã finaly của tôi, là có một nhu cầu cho bất kỳ improvments?

$(document).ready(function(){ 
    var pathname = window.location.pathname; 
    var onDomain=true; 
    $("#links ul li a").each(function() { 
     var href= $(this).attr("href"); 
     if (href != undefined && pathname.indexOf(href) >= 0){ 
      $(this).addClass("active"); 
      onDomain=false; 
     } 
    }); 
    if (onDomain){ 
     $("#links ul li:first-child a").addClass("active"); 
    } 
}); 

Answer 1

Chỉ định href to a;

<nav id="links"> 
    <ul> 
     <li><a href="index.php">Home</a></li> 
     <li><a href="">About</a></li> 
     <li><a href="">Contact</a></li> 
    </ul> 
</nav> 

Sau đó thử:

var pathname = window.location.pathname; 
    $("#links ul li a").each(function() { 
     var href= $(this).attr("href"); 
     if (href.length && pathname.indexOf(href) >= 0){ 
      $(this).addClass("active"); 
     } 
    }); 

Nếu bạn không thể thay đổi mã HTML sau đó thử như sau:

var pathname = window.location.pathname; 
    $("#links ul li a").each(function() { 
     var href= $(this).attr("href"); 
     if (href != undefined && pathname.indexOf(href) >= 0){ 
      $(this).addClass("active"); 
     } 
    }); 

Answer 2

var loc = ''+($(location).attr('href').split('/').slice(-1)); 
if(typeof loc !== 'undefined'){ 
    $("#links li").find("a[href='"+loc+"']").each(function(){ 
     $(this).addClass("active"); 
    }); 
}else(typeof loc === 'undefined'){ 
    $("#links li a:eq(0)").addClass("active"); // if you use 'home' as your first. 
} 

Answer 3

Nó có lẽ rằng lớp tích cực nên được áp dụng cho các li .. Giả sử logic của bạn là chính xác và lớp nên được áp dụng cho các li (khó có thể nói nếu không có sự html và css):

if (pathname.indexOf(href) >= 0){ 
     $(this).parent().addClass("active"); 
} 

Answer 4

Tôi không chắc tôi nhận được câu hỏi ở tất cả, nhưng Tôi muốn tìm một cái gì đó như:

$("#links ul li a").filter(function() { 
    return window.location.pathname.indexOf(this.href) != -1; 
}).addClass('active'); 

Answer 5

<script type="text/javascript"> 

$(window).load(function() { 
        var url = window.location; 
        $('#nav a').filter(function() { 
         return this.href == url; 
        }).parents("li").addClass('active'); 

      }); 
</script> 

nó làm việc sử dụng kịch bản này khi bạn sử dụng tập tin bên ngoài cho menu

như index.php inclide menu.php bạn phải sử dụng scritp này tu phát hiện url nạp và menu lớp thay đổi để lớp hoạt động.

Cảm ơn U thecodeparadox mã của bạn đang hoạt động