这对一些人来说可能很容易,但我已经尝试了各种方法来让它工作,但无济于事。
文字简介;
我有一个页面,我有链接在这个页面,当点击加载其他页面,但显示在同一页面
<section class="posts-header">
<div class="col span-3-of-3">
<ul class="posts-nav" id="navigation">
<li><a href="blog_admin_posts.php?source=view_all_posts">View Posts</a></li>
<li><a href="blog_admin_posts.php?source=view_posts">View Posts</a></li>
<li><a href="blog_admin_posts.php?source=add_posts">Create Post</a></li>
</ul>
</div>
</section>
上面的代码显示了当单击链接时,使用$_GET
将变量传递给下面的switch语句;
if(isset($_GET['source'])) {
$source = $_GET['source'];}
switch($source) {
case 'view_posts';
include "php/blog_posts_view.php";
break;
case 'view_all_posts';
include "php/blog_posts_reviewer.php";
break;
case 'add_posts';
include "php/blog_posts_addform.php";
break;
case 'edit_posts';
include "php/blog_posts_editform.php";
break;
default:
include "php/blog_posts_view.php";
break;}
如何高亮显示当前页面?使用html, js, css3或所有。谢谢。
您可以在CSS中定义一个active
类,它描述了活动链接的样式。例如,一个非常简单的样式:
.active {
color: red;
}
然后你必须修改你的菜单:
<section class="posts-header">
<div class="col span-3-of-3">
<ul class="posts-nav" id="navigation">
<li><a href="blog_admin_posts.php?source=view_all_posts"<?=$_GET['source'] == "view_all_posts" ? " class="active"" : ""; ?>>View Posts</a></li>
<li><a href="blog_admin_posts.php?source=view_posts"<?=$_GET['source'] == "view_posts" ? " class="active"" : ""; ?>>View Posts</a></li>
<li><a href="blog_admin_posts.php?source=add_posts"<?=$_GET['source'] == "add_posts" ? " class="active"" : ""; ?>>Create Post</a></li>
</ul>
</div>
</section>
活动菜单链接文本现在应该显示为红色
也许你会发现这非常有用,它可以将你的类添加到当前页面,并允许通过简单地添加到数组中来添加更多的链接到你的页面。
<?php
$page = isset($_GET['page']) ? $_GET['page']: ' ';
$pages = ['view_all_posts','view_posts','add_posts'];
$active = '';
if (in_array($page,$pages)){
$active = 'active';
}
?>
然后修改你的菜单:
<section class="posts-header">
<div class="col span-3-of-3">
<ul class="posts-nav" id="navigation">
<?php foreach ($pages as $key => $value) : ?>
<li>
<a href="blog_admin_posts.php?source=<?=$value?>" class="<?=$active?>"><?=$value?></a>
</li>
<?php endforeach;?>
</ul>
</div>
</section>
您可以使用以下命令获取当前页面名称:
$pageName = $_GET["source"];
然后,对于每个列表项,你可以这样做:
<li class="<?= ($pageName === 'firstPageName') ? 'active' : '' ?>"><a href="...">...</a></li>
当然,你需要样式类.active
或任何你想命名它