如何在不需要匹配大小写的情况下匹配 jQuery 中的元素？ [复制]

Question

我有一个带有一些导航的页面，如果这是我们所在的页面，我会尝试突出显示链接。就像这样，它几乎可以很好地工作：

function highlightPageInNav() {
        // Get file name.
        var filename = window.location.href.substr(window.location.href.lastIndexOf("/") + 1);
        // Build selector.
        var attrSelector = "a[href='" + filename + "']";
        // Set class of li to "current".
        $("#nav ul li").has(attrSelector).addClass("current");
}

问题是我的导航中的锚点说，例如，“CreateUser.aspx”，但如果当前 URL 包含“createuser.aspx”，脚本将不匹配。

我尝试了其他几个想法，包括使用以下内容替换上面的部分脚本。我将文件名转换为 toLowerCase() 然后尝试将其与 href .toLowerCase() 匹配，这些警报向我展示了我的期望，但 $(this).addClass("current"); 实际上并没有做任何事情——我猜很可能是因为@ 987654324@ 不再适用于我要修改的元素。

$("#nav ul li a").each(function () {
    alert($(this).attr("href"));
    hrefLowerCase = $(this).attr("href").toLowerCase();
    alert(hrefLowerCase);
    if (filename == hrefLowerCase) {
        alert("found one!");
        $(this).addClass("current");  // This is where it stops doing what I desire.
    }
});

所以，如果有人能告诉我如何非常简单地使我的脚本同时匹配“CreateUser.aspx”和“createuser.aspx”，那将不胜感激！谢谢！

Answer 1

我已经稍微更正了 DGS 的答案以使其正常工作。

var filename = window.location.href.substr(window.location.href.lastIndexOf("/") + 1).toLowerCase();
$('#nav ul li a').each(function() {
    if ($(this).attr('href').toLowerCase() === filename) {
        $(this).parent().addClass('current');
    }
});

它应该将当前类添加到 li 标签，而不是 anchor。

建议的其他方法是使用过滤器：

var filename = window.location.href.substr(window.location.href.lastIndexOf("/") + 1).toLowerCase();
$('#nav ul li a').filter(function() {
    return $(this).attr('href').toLowerCase() === filename;
}).parent().addClass('current');

Answer 2

var filename = window.location.href.substr(window.location.href.lastIndexOf("/") + 1);    
$('#nav ul li a').filter(function() {
    return this.href.toLowerCase() == filename;
}).addClass('current');