Question

我不知道为什么这不起作用，我一直在努力。

大多数在线教程都使用Ajax，我不是，我已经尝试过改编它，但我无法得到任何工作。我正在使用有爆炸网址，所有内容都加载到索引页面中，它只是被动态显示和隐藏。我真的可以使用一些帮助让历史工作。

这是我的剧本......

History.Adapter.bind(window, 'statechange', handleStateChange);
$('nav a').on('click',function(e) {
    var target = $(this).attr('href');

    History.pushState(null, null, target);
});

function handleStateChange() {
    alert("State changed...");
}

如果我能够发出警报，我可以从那里开始，但是警报从未触发，我不知道为什么。

Answer 1

我认为“$（'nav a'）”是您发布的代码中的拼写错误，应该是：

....
$('#nav a').on('click',function(e) {
var target = $(this).attr('href');
....

在这个FIDDLE中，我假设你想使用带有“nav”的标签div作为id属性，并在其中使用一些链接希望它有所帮助..

Answer 2

只需在绑定事件之前定义您的函数，就这样：

function handleStateChange() {
    alert("State changed...");
}
History.Adapter.bind(window, 'statechange', handleStateChange);
$('nav a').on('click',function(e) {
    var target = $(this).attr('href');

    History.pushState(null, null, target);
});

或者我通常喜欢做得更好，在bind中定义函数，当然如果你以后不需要在脚本中使用相同的函数。

History.Adapter.bind(window, 'statechange', function() {
    alert("State changed...");
});

$('nav a').on('click',function(e) {
    var target = $(this).attr('href');

    History.pushState(null, null, target);
});

让history.js在没有Ajax加载页面的情况下工作

2 个答案: