Question

我有一个网站菜单，其中有链接（当然是它，它是一个闪烁的网站菜单），它们只在翻转时改变颜色，这些链接由我的sitemenu.php控制，每个页面都包含这些链接以便于更改sitemenu ..我的好处是，现在我喜欢它，这样当你在一个页面上时，带你到那里的链接会被着色，直到你离开那个页面。我不能手动执行，因为所有链接都在一个主要PHP脚本上，如果改变，则以相同的方式改变其余部分。

我知道如何添加一个类，它将永久地为链接着色，但不知道如何使用javascript虽然我认为它只会使用当前页面网址，在网站菜单中找到并添加一个类属性。

Answer 1

您可以使用PHP脚本或Javascript函数执行此操作。

PHP：

在您的sitemenu.php中，执行类似菜单的操作 -

<li><a href="index.php"<?php if($page == 'index') echo ' class="active"'; ?>>Home</a></li>
<li><a href="b.php"<?php if($page == 'b') echo ' class="active"'; ?>>B</a></li>
<li><a href="c.php"<?php if($page == 'c') echo ' class="active"'; ?>>C</a></li>
<li><a href="d.php"<?php if($page == 'd') echo ' class="active"'; ?>>D</a></li>

现在，在每个页面中，您只需在包含sitemenu.php文件之前设置$ page。

例如，在索引页面中执行类似

的操作

$page = 'index';
include('sitemenu.php');

除非您使用Javascript进行AJAX，否则您必须解析您所在的页面，然后更改链接的样式。如果您为每个链接点击使用AJAX，那么您只需要在onclick函数内部使用

this.style.color='somecolor'

希望这能回答你的问题。这里只是个人偏好，但我喜欢使用PHP路线。无论何时添加/删除项目，都可以轻松编辑导航。

Answer 2

如何添加一些css规则，如a:visited{color:#eeeeee;}或其他什么？如果您来自某个页面，并且菜单中有一个指向此页面的链接，则此链接应该访问伪选择器。

Answer 3

这应该给你基本的想法（使用jQuery / JavaScript）。它将active类添加到当前页面。您可能需要根据站点的链接约定进行调整：

var url = document.location.pathname.toString();

$('a').each( function() {
    // if it matches
    if ($(this).attr('href').indexOf(url) != -1) {
       $(this).addClass('active');
    }
});

Here's a working demo

Javascript特定属性更改

3 个答案: