Question

想象一下以下标记：

<a href="#link01">1</a>
<a href="#link02">2</a>

和

$('a').click(function(){
   var href = $(location).attr('href'),
   hrefLenght = href.length,
   hrefPos = href.indexOf("#"),
   hrefPage = href.slice(hrefPos+1);
   alert(hrefPage);
});

现在，点击链接后会发生的事情是，jQuery会警告{<1}} 之前点击链接，而不是之后，如预期。因此：

1）我位于hrefPage
2）我点击链接
3，结果）http://www.example.com/#link01得到回应 3，预期）link01被回应

任何想法如何解决这个问题？

编辑：为什么我使用的是位置而不是href？因为我希望上面提到的代码也可以在页面加载href时完全没有任何被点击的东西，我认为为同一个过程编写两段代码并不是一个好主意吗？

Answer 1

您的代码中存在错误。您使用的this代码location代替window.location。

$('a').click(function(){
   var href = $(this).attr('href'),
   hrefLenght = href.length,
   hrefPos = href.indexOf("#"),
   hrefPage = href.slice(hrefPos+1);
   alert(hrefPage);
});

Answer 2

您可以使用hashchange事件来监控这些更改：

$('a').bind('hashchange',function(){ 
    var hval = location.hash.slice(1); // remove the leading #
    alert(hval);
});

要在页面加载时触发hashchange，因此它会触发到哈希的外部链接，或者当您使用后退按钮浏览时（而不是仅在单击链接时），请添加以下内容：

$(document).ready(function() {
    $(window).trigger('hashchange');
});

Answer 3

为什么不使用您点击的链接的href？它将具有href在更改后将具有的值。

$('a').click(function(){
  var href = this.href,
  hrefLength = href.length,
  hrefPos = href.indexOf("#"),
  hrefPage = href.slice(hrefPos+1);
  alert(hrefPage);
  // could also use:
  // alert(this.href.split("#")[1]);
});

Answer 4

您需要在运行javascript之前更改网址。你可以这样做的一种方法是简单地把

window.location = $(this).attr('href');

在javascript代码的顶部，强制窗口导航操作发生在您的javascript

之前

示例：http://jsfiddle.net/btdqe/

让jQuery在读取href之前等待href更改？

4 个答案: