检测锚点是否通向活动窗口。位置

Question

拥有这样的 html:

<a class="someclass" href="some/url/absolute/or/relative">Blah</a>

... 以及这样的 javascript:

$("a.someclass").onclick(function() {
    var link = $(this).attr("href");
    if (link == window.location) // <<<<<<<<<<<<
        doSomethingSpecial();
    else
        doOtherThing();
    return false;
});

这段代码显然不起作用。

如何可靠地检测某个锚点是否指向当前浏览器位置？

以下是一些注意事项：

• 锚点的 href 可以是绝对的，也可以是相对的。
• URL 的片段应该被忽略。

Answer 1

问题是 $('a').attr('href') 始终返回相对路径。您需要使用原生的 obj.href 属性来获取绝对路径，剥离哈希值然后进行比较：

var clean = function(str) {
    return str.replace(/(\#.*)/,'').toLowerCase();
}

$("a.someclass").click(function(e) {
    if (clean(this.href) == clean(window.location)) {
        // the link destination is equal to window.location (excluding hashes)
        doSomethingSpecial();
    } else {
        doOtherThing();
    }
    e.preventDefault();
});

编辑：

如果您想比较路径名，可以直接抓取它来自锚元素：

$("a.someclass").click(function(e) {
    if (this.pathname == window.location.pathnname) {
        doSomethingSpecial();
    } else {
        doOtherThing();
    }
    e.preventDefault();
});

Answer 2

AFAIK，你无法检测到这一点。因为我可以编写 onclick 事件处理程序，然后编写导致当前位置本身的代码。在这种情况下，您不能真正依赖 href 属性。

function ReloadWin()
{
    window.location.reload();
}

<a href="#" onclick="ReloadWin();">Click me to reload</a>

Answer 3

试试这个：

$(document).ready(function(){
    $("a.someclass").click(function(){

        //convert both to lower case
        var h=$(this).attr("href").toLowerCase();
        var l=window.location.href.toLowerCase();

        //if has hash tag remove portion after if
        if(l.indexOf("?")>0)
            l=l.substring(0,l.indexOf("?"));
        if(l.indexOf("#")>0)
            l=l.substring(0,l.indexOf("#"));

        if(l.length > h.length)
            l = l.substring(l.length - h.length);

        if(l==h){
            alert("On same page");
        }else{
            alert("Other page");
        }
        return false;
    });
});