在我的网站上,每个页面都有相同的侧边栏,只是每个页面的链接。我没有在每个页面上写相同的东西,而是使用文件'sidebar.html',然后将其包含在每个使用php的页面中:
<?php include 'sidebar.html'; ?>
现在我想在侧边栏中使用与任何其他页面名称不同颜色的当前页面的名称。我用这样的JavaScript完成了这个: 1.按特定ID获取当前页面名称 2.将名为“active”的新id设置为此名称,并在css #active中获取新颜色
我想知道是否有其他解决方案可以获得相同的结果,也许是否存在不使用JavaScript的解决方案。
谢谢!
答案 0 :(得分:4)
您可以将sidebar.html
替换为sidebar.php
文件,只需使用PHP变量;例如,您可以在当前页面中定义一个代表当前ID的变量,并在sidebar.php
中使用它来确定哪个链接应为active
答案 1 :(得分:2)
其他答案表明PHP变量是实现此目的的一种方法。另一方面,你可以不使用PHP或JavaScript,只使用纯CSS。
首先在<body>
标记或其他高级包装上指明当前具有类名的页面。
<body class="contact-page">
然后在侧边栏中,确保每个链接都有一个唯一的类。类似的东西:
<a href="/" class="sidebar-home">Home</a>
<a href="/contact.php" class="sidebar-contact">Contact</a>
... and so on
现在你可以编写CSS类来完成其余的工作!因此,如果您希望所选链接为蓝色,例如......
.home-page .sidebar-home { color: blue; }
.contact-page .sidebar-contact { color: blue; }
答案 2 :(得分:0)
您可以将html文件更改为php文件并传递参数。
然后,在新的sidebar.php
中,获取参数并相应地定义活动类。
答案 3 :(得分:0)
我会做这样的事情:
<强>的sidebar.php 强>
$links = array();
$links['page1.html'] = 'Page 1';
$links['page2.html'] = 'Page 2';
$links['page3.html'] = 'Page 3';
$curr_page = basename($_SERVER['PHP_SELF']);
foreach($links as $k=>$v)
{
echo '<a href="'.$k.'"';
if($curr_page === $k)
{
echo ' class="active_link"';
}
echo '>'.$v.'</a>';
}
只是想指出,如果你把文件放到这样的子目录中,事情会变得复杂:
$links = array();
$links['subdir1/page1.html'] = 'Page 1';
$links['subdir2/page2.html'] = 'Page 2';
$links['subdir3/page3.html'] = 'Page 3';