我想知道让菜单记住当前处于活动状态的项目的最简单方法是什么。例如，如果我在菜单中按“服务”并加载服务页面，我希望突出显示菜单中的“服务”项。我应该用jquery还是php，怎么样？
感谢您的任何建议..
【问题讨论】：
这是一个完全基于 URL 的解决方案。如果您的页面与您的菜单项具有相同的名称，您可以简单地解析出 URL 以找到适当的项来应用类或样式。请不要，尽管此解决方案取决于您的页面与菜单项的名称相同这一事实。
例如：
// With a URL like:
// http://www.thisisanexample.com/modules/pro/blogs/blogs.php?action=my_page&mode=main
var url = window.location.href;
url = url.substr(url.lastIndexOf('/') + 1);
url = url.substr(0, url.indexOf('.'));
// Sample switch to add class to appropriate menu item
switch (url) {
case " --> some page <-- ":
// add menu item for this page
break;
case "blogs":
$('#blog-menuItem').addClass('active');
break;
case " --> some other page <-- ":
// add menu item for this page
break;
}
// url would effectively contain "blogs" after the parsing.
此代码是轻量级的，可让您不必跟上任何服务器端变量或 cookie。
希望这会有所帮助。
【讨论】：
$(document).ready(function () { ... }); 或简写$(function () { }); 中，以便它在 DOM 准备好时自动运行。是这个意思吗？
这在 PHP 中相当容易。您可以为简单页面编写一个快速函数...示例：
<?php
function page() { return basename($_SERVER['PHP_SELF'], ".php"); }
?>
<a href="foobar.php" class="<?php if(page() == "foobar") echo "active"; ?>">Foo</a>
<a href="bazbiz.php" class="<?php if(page() == "bazbiz") echo "active"; ?>">Baz</a>
话虽如此，这是一个粗略的例子。这实际上取决于您的应用程序、目标、框架等。在不知道发生了什么的情况下，任何事情都不会一成不变。
【讨论】：
每次加载页面时，您都是从头开始创建菜单，这意味着您可以随意修改它。
一般来说，如果你加载不同的页面，你可以这样使用 PHP：
<a href="myLink.php" class="<?php if ($_SERVER["REQUEST_URI"] == "/mypage") echo "myClass"; ?>">Foo</a>
您还可以使用 CSS 来设置当前正在使用活动伪类访问的链接的样式。
a:active
{
background-color:yellow;
}
如果您需要在不更改当前页面的情况下让您的菜单看起来不同，那么您可以使用 Javascript。
这是一个将类添加到使用 Jquery 单击的菜单的示例：
$("#menuId").click(function()
{
$("#menuId").addClass("myClass");
});
还有许多其他可能的方法可以做到这一点，您可以使用 cookie 甚至会话来做到这一点，但我认为在您的情况下 PHP 或 CSS 版本效果最好。
【讨论】：
我会使用本地存储（适用于所有浏览器，即 8+）。
这样设置：
localStorage.activeItem = 'services';
然后变成这样：
$('#output').html('active item: ' + localStorage.activeItem);
编辑： 快速说明 - localStorage 保存在用户计算机上，因此即使用户离开您的站点并在几个月后再次返回，它也会保留。考虑到这一点，您可能希望在 activeItem 离开之前或在第一页加载之前清除它们。
【讨论】：