javascript - URL 更改时调用 javascript 函数

Question

我不确定我在寻找哪个主题，但这里是我想要实现的目标的描述：

• 当 URL 更改时，应该调用 javascript 方法而不是尝试加载该 URL 的页面。

我尝试这样做的原因是出于 SEO 的目的，我需要使用分段 URL。但是，我也在尝试使用预加载的 HTML 模板即时创建“新页面”。因此，我不想加载新页面，而只想调用将使用模板呈现页面的关联方法。

这种行为可能吗？

注意：我认为值得一提的是，现有系统目前使用 URL 哈希来检测是否会加载新页面。

问候，

欧文

Answer 1

您需要将点击处理程序附加到您阻止默认操作并执行重定向的所有链接。使用 jQuery，这可以很简单：

$(document).ready(function () {
  $('a').on('click', function () {
    $(location).attr('href','your_url'); // redirect wherever you want to go
    return false;
  });    
});

Answer 2

我最近做了类似的事情。
假设我了解您所追求的，这是在哈希更改时执行函数的侦听器

var last_hash = "";

setInterval(function(){
    hash = window.location.hash;

    if(last_hash != hash && hash.length != 1){
        hash = hash.substring(1)

        //Making sure that there's actually a function with that name
        if(typeof window[hash] == 'function'){
            var fn = window[hash];

            //Execute the function
            fn.apply({param: "param1"}, ["param1", "param2"]);
        }
        last_hash = window.location.hash;
    }
}, 250);

您可以通过分离函数名称和参数来对哈希进行一些额外的解析，然后将所有参数添加到数组以传递给.apply，但我将这部分留给您。

如果您使用的是实际 url 而不是散列，只需确保阻止页面上链接的默认行为，以及之后您随后加载的任何链接。

function attach_disablelinks(){
    $("a").on("click", function(e){
        e.preventDefault();
    });
}