如何根据 URL 的开始方式将类添加到菜单项？答案

【问题标题】：How to add the class to menu item based on how the URL starts?如何根据 URL 的开始方式将类添加到菜单项？
【发布时间】：2012-09-15 13:40:38
【问题描述】：

在我的网站目录“foto”中，我有很多以网址“http://example.com/foto/article-name”或“http://example.com/tech/article-name”开头的文章

我有一个带有 URL“http://example.com/foto/”的菜单项。

当其中一篇文章没有菜单链接时，如何突出显示我的菜单项“FOTO”。换句话说，我想有一个条件：

如果网址以“http://example.com/foto/”开头，则突出显示菜单项FOTO 或者如果 URL 以“http://example.com/demo”开头，则突出显示菜单项VIDEO，

这意味着文章和菜单项的 URL 不能以相同的 URL 开头。

提前致谢

【问题讨论】：

你不能用 PHP（或任何你用于后端的东西）传输一个标识符，它告诉你你在哪个页面上？
jQuery add class based on page URL 的可能重复项
他的意思是，如果没有“后端”，那么每个页面都是您需要单独创建的单个页面。反过来，这意味着您可以输入包含“我是谁？”的隐藏字段（css 样式显示：无；）。并且根据 THIS 字段（您将使用 JS 加载），您可以确定要设置的突出显示。
它看起来像重复，我会尝试..

标签： jquery menu addclass

【解决方案1】：

您可以执行以下操作：

var url = window.location.href; // Get the current URL

// Check for foto inside URL //
if (url.indexOf("foto") != -1){
    alert('foto');

    // Add selected class to menu item //
    $('#menu_item_id').addClass('selected');
}

然后您可以简单地为其他菜单项标题添加额外的检查。

我希望这会有所帮助！

【讨论】：

嗯，我试过了，谢谢！但是你知道如果我有出现在 URL example.com/foto/demo/article-name 中的子目录“demo”并且在我的脚本 URL 中有两个菜单项 FOTO 和 DEMO 以及两个规则，那么哪些菜单项会被突出显示。 indexOf('foto') 和 url.indexOf('demo') ?
我删除了 alert('foto');因为我不需要查看警报窗口。你能解释一下“！= 1”的目的吗？在“照片”找不到的情况下提醒“-1”？
所以，现在我遇到了一个问题，当我开始添加其他菜单项规则时，我意识到这个脚本不会从预览菜单项中删除“选定”类。我添加了 ($('#navigation li').removeClass('selected'); 但它没有帮助。出了什么问题？现在看起来像 if (url.indexOf("foto")) { $('#navigation li').removeClass('selected'); $("#lifoto").addClass('selected'); } else if (url.indexOf("demo")) { $('#navigation li').removeClass ('selected'); $("#lidemo").addClass('selected'); }