Question

我不是javascript高手，但我需要创建一个完成以下操作的脚本。

如果body id =“index”将class“current-selected”添加到锚标记，其中href = index.php 如果body id =“services”将class =“current-selected”添加到锚标记，其中href = services.php 等

这有什么意义吗？有人可以帮忙吗？

谢谢，如果可以的话！

Abbotsford Web Design

Answer 1

这样的事情应该可以解决问题。这将动态确定您的body元素ID并更改引用同名php文件的所有锚标记。

var bodyID = $("body").attr("id");

$("a[href='" + bodyID + ".php']").addClass("current-selected");

如另一条评论中所述，使用.removeClass("current-selected")函数完成相反的操作。

另外，如果您的网址只有结尾带有“index.php”，即href属性类似于“/something/index.php”，请使用“a[href$='" + bodyID + ".php']”作为您的选择。这将匹配以文件名结尾的href值。

Answer 2

以Using Jquery to add/remove a class based on body Id：

为基础

var bodyID = $('body').attr('id');

$("a[href$='" + bodyID + ".php']").toggleClass('current-selected'); //add/remove

OR

$("a[href$='" + bodyID + ".php']").addClass('current-selected'); //add

而不是“=”，我们使用“$ =”（指“href $ =”）语法，它将匹配字符串的结尾，因此“index.php”和“/index.php”都将是与“index.php”匹配。

要在您的站点上实现它，您需要在jQuery ready函数中运行上面的代码，以便在Javascript对其执行操作之前加载脚本块下面的所有HTML：

编辑：这适用于您网站的所有主要/顶部导航链接（匹配href的字符串是网址的最后一个路径段）：

<script type="text/javascript">
$(document).ready(function(){
    page = window.location.pathname.substring(1).replace(/\//g,'');
    $("a[href*='" + page + "']").addClass('current-selected');
});
</script>

Answer 3

假设您的身份证件并不总是与其相应链接的文件名完全匹配，您可以这样做。

$("body#index a[href='index.php']").addClass("current-selected");
$("body#service a[href='service.php']").addClass("current-selected");

如果您的正文ID始终与您对应的链接href值匹配，您可以首先提取正文ID，并将其用作jQuery选择器中的变量：

var body_id = $("body").attr("id");
$("a[href='"+body_id+".php']").addClass("current-selected");

Answer 4

$('body#index a[href="index.php"]').addClass("current-selected");
$('body#services a[href="services.php"]').addClass("current-selected");

使用Jquery根据正文ID添加/删除类

4 个答案: