如何使用jquery在引导程序中激活导航栏
如何使用jquery在引导程序中激活导航栏
提问于 2013-07-18 15:18:26
当我点击导航栏时，我想激活它，
下面是我使用的jquery
$(document).ready(function () {
$('.navbar li').click(function(e) {
$('.navbar li').removeClass('active');
var $this = $(this);
if (!$this.hasClass('active')) {
$this.addClass('active');
}
e.preventDefault();
});
});但是因为preventDefault，我不能转到我想要的链接。它只是激活导航栏，而不是转到我选择的链接。
下面是链接代码：
<div class="nav-collapse collapse">
<ul class="nav">
<li><a href='<?php echo site_url(' tampilan ') ?>'>Knowledge Base</a>
</li>
<li><a href='<?php echo site_url(' ticketing/browse_ticketing ') ?>'>Ticketing</a>
</li>
<li><a href='<?php echo site_url(' user/logout ') ?>'>Logout</a>
</li>
</ul>
</div> 如果我不使用preventDefault()，导航栏将不会激活，但如果我使用它，我无法转到我想要的链接。
回答 3
Stack Overflow用户
回答已采纳
发布于 2013-07-19 10:55:00
将jQuery脚本更改为：
<script type="text/javascript">
$(document).ready(function () {
var url = window.location;
$('ul.nav a[href="'+ url +'"]').parent().addClass('active');
$('ul.nav a').filter(function() {
return this.href == url;
}).parent().addClass('active');
});
</script> Stack Overflow用户
发布于 2013-07-18 15:32:41
您可以使用以下javascript根据当前的url添加活动类
我假设您正在使用codeigniter，所以uri_string()函数是可用的
$(document).ready(function () {
var active_link = $('.navbar li a[href~="<?= uri_string() ?>"]');
if(active_link.size() > 0) active_link.parent().parent().addClass('active');
});Stack Overflow用户
发布于 2013-07-18 15:39:33
对于您的问题，我得到的是您想要将active类设置为li，然后重定向到其他页面。如果我没理解错的话，那么，
看起来你正在以一种错误的方式接近它。您正在尝试首先将active类设置为li，然后重定向到不同的页面。这无论如何都不会起作用，因为重定向后active类将不会自动维护。
因此，正确的方法是只在目标页面上放置active类逻辑，即首先导航到目标页面，在那里您可以将active类设置为li。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/17717025
复制相关文章
相似问题
腾讯云开发者
