【发布时间】:2017-12-12 16:06:36
【问题描述】:
我的脚本标签中有以下内容。但是,每当我单击 test.php 或 test2.php li 链接时,我都不会被重定向到相应的页面。 但是,活动类从 index.php 文件更改为 test.php 或 test2.php 文件,具体取决于单击了哪个链接,但我没有被定向到该页面。我尝试了以下链接中的解决方案,但现在它们产生了我想要的结果,即将我重定向到单击的页面并将活动类更新为 li 元素。
How to change active class while click to another link in bootstrap use jquery?
每当我取消注释此行 e.preventDefault() 时,我都可以导航到已单击但活动类未更新为 li 元素单击,但是当该行被注释时,我无法导航到单击的页面,而是在单击的 li 元素上更新活动类。
<div class="menu">
<ul class="list">
<li class="header">MAIN NAVIGATION</li>
<li class="active">
<a href="index.php">
<i class="material-icons">home</i>
<span>Home</span>
</a>
</li>
<li class="">
<a href="test.php">
<i class="material-icons">group</i>
<span>Test</span>
</a>
</li>
<li class="">
<a href="test2.php">
<i class="material-icons">people</i>
<span>Test2</span>
</a>
</li>
</ul>
</div>
还有script 代码:
$(document).ready(function () {
$('.menu .list a').click(function(e) {
$('.menu li.active').removeClass('active');
var $parent = $(this).parent();
$parent.addClass('active');
e.preventDefault();
});
});
test.php的内容如下:
<body class="theme-red">
<nav class="navbar">
<?php include_once('navbar.html'); ?>
</nav>
<section>
<aside id="leftsidebar" class="sidebar">
<?php include_once('left-side-bar.html');?>
</aside>
</section>
<section class="content">
<div class="container-fluid">
<div class="row clearfix">
<table id="tbl-users" class="table">
<thead>
<tr>
<th>ID</th>
<th>Name</th>
</tr>
</thead>
<tfoot>
<tr>
<th>ID</th>
<th>Name</th>
</tr>
</tfoot>
<tbody>
<?php
$accounts = get_details();
foreach($accounts as $acc){
?>
<tr>
<td><?php echo $acc['id']; ?></td>
<td><?php echo $acc['name']; ?></td>
</tr>
<?php
}
?>
</tbody>
</table>
</div>
</div>
</section>
</body>
【问题讨论】:
-
我认为您需要使用 PHP 应用活动类。如果您取消注释
e.preventDefault();并单击链接,页面将刷新并且您使用 jQuery 所做的任何前端更改都将被重置。 -
如果可以的话,添加 test.php 或 test2.php 的代码以准确了解它是什么。
-
@Highdef test.php已经添加了代码
标签: javascript jquery html css