Question

我正在使用“document.location.hash”剥离网址并尝试检查当前网址留下的内容。我不想使用任何插件，也不想学习点击等触发事件的结果。需要立即学习和改变当代的网址。

jQuery的：

$(function() {
    $(document).location().change(function() {//this part is not working
        var anchor = document.location.hash;
        if( anchor === '#one' ) {
            alert('current url = #one');
        }else if ( anchor === '#two' ) {
            alert('current url = #two');
        }else if ( anchor === '#three' ) {
            alert('current url = #three');
        }
        console.log(anchor);
    });
});

HTML：

<a href="#one">one</a>
<a href="#two">two</a>
<a href="#three">three</a>

深注：我已经阅读了这些问题并且cout找到了我要找的东西： How to detect URL change in JavaScript + How to change the current URL in javascript?

Answer 1

不使用jQuery以外的插件，您可以处理'hashchange'事件：

$(document).ready(function() {
    $(window).bind( 'hashchange', function(e) { 
    var anchor = document.location.hash;
            if( anchor === '#one' ) {
                alert('url = #one');
            }else if ( anchor === '#two' ) {
                alert('url = #two');
            }else if ( anchor === '#three' ) {
                alert('url = #three');
            }
            console.log(anchor);
    });
});

警告： Not all browsers support the hashchange event.

与后备一起使用：您应该use Modernizr to detect if hashchangeEvent is supported并且如果该支持检查失败，则回退到Ben Alman's jQuery hashchange event plugin并在您的其他区块中使用@Baylor Rae的解决方案。

Answer 2

你可能会发现Ben Alman的jQuery hashchange event plugin很有帮助。

$(function(){

  // Bind the event.
  $(window).hashchange( function(){
    // Alerts every time the hash changes!
    alert( location.hash );
  });

  // Trigger the event (useful on page load).
  $(window).hashchange();

});

当发生任何变化时如何检测当前URL

2 个答案: