更改活动页面及其子页面菜单的背景颜色

Question

我正在更改当前菜单项的背景颜色。

例如我在abc.com/tours上，因此使用以下代码将菜单项“tours”的颜色更改为粉红色。

<script> 
$(document).ready(function() {
$("[href]").each(function() {
if (this.href == window.location.href) {
    $(this).addClass("change_color_pink");
    }
});
});
</script>

如果我去abc.com/tours/australia，我希望菜单项“tour”保持粉红色。我该怎么办？

注意：/ tours / australia是/ tour中的链接

Answer 1

您可以将颜色值存储在cookie或url query string中，并在以下页面中将状态读回到您的函数中。

Answer 2

如果您的模型由一个网址和一个由html元素组成的菜单组成，您首先必须引入可以将您的网址解析为相关部分的逻辑。如果您的格式是domain.com/child/child/child /，那么这应该非常简单。当您拥有此数据时，例如，在数组中，您必须将其投影到您的html结构。假设您的菜单标记是分层的，那么迭代查找顶部html元素，进行修改并搜索当前元素中的下一个顶部元素可能并不困难。