87

私は使っている：

$(window).bind( 'hashchange', function(e) { });

関数をハッシュ変更イベントにバインドします。これはIE8、Firefox、およびChromeでは機能するようですが、Safariでは機能せず、以前のバージョンのIEでは機能しないと思います. hashchangeこれらのブラウザーでは、ハッシュとイベント を使用する JavaScript コードを無効にしたいと考えています。

hashchangeブラウザがイベントをサポートしているかどうかを検出できるjQueryの方法はありますか? 多分何かjQuery.support...

4

12 に答える 12

69

ブラウザーがイベントをサポートしているかどうかは、次の方法で検出できます。

if ("onhashchange" in window) {
  //...
}

以下も参照してください。

于 2010-06-22T05:22:27.557 に答える
18

ここで利用可能な機能とクロスブラウザの問題をまとめたhashchangeプラグインがあります。

于 2010-06-22T05:53:58.840 に答える
18

あなたの問題への別のアプローチ...

hashchangeイベントをメソッドにバインドする方法は3つあります。

<script>
    window.onhashchange = doThisWhenTheHashChanges;
</script>

または

<script>
    window.addEventListener("hashchange", doThisWhenTheHashChanges, false);
</script>

または

<body onhashchange="doThisWhenTheHashChanges();">

これらはすべて、Win7のIE9、FF 5、Safari 5、およびChrome12で動作します。

于 2011-06-29T15:25:58.620 に答える
8

Mozillaの公式サイトをお試しください：https ：//developer.mozilla.org/en/DOM/window.onhashchange

次のように引用します。

if ("onhashchange" in window) {
    alert("The browser supports the hashchange event!");
}

function locationHashChanged() {
    if (location.hash === "#somecoolfeature") {
        somecoolfeature();
    }
}

window.onhashchange = locationHashChanged;
于 2011-09-07T03:00:18.817 に答える
3

私はちょうど同じ問題に遭遇しました (IE7 での hashchange イベントの欠如)。私の目的に適した回避策は、ハッシュ変更リンクのクリック イベントをバインドすることでした。

<a class='hash-changer' href='#foo'>Foo</a>

<script type='text/javascript'>

if (("onhashchange" in window) && !($.browser.msie)) { 

    //modern browsers 
    $(window).bind('hashchange', function() {
        var hash = window.location.hash.replace(/^#/,'');
        //do whatever you need with the hash
    });

} else {

    //IE and browsers that don't support hashchange
    $('a.hash-changer').bind('click', function() {
        var hash = $(this).attr('href').replace(/^#/,'');
        //do whatever you need with the hash
    });

}

</script>
于 2012-07-06T22:12:01.613 に答える
3

IE 7 および IE 9 の場合、if ステートメントは (Windows では "onhashchange") に対して true を返しますが、window.onhashchange は決して起動しないため、ハッシュを保存し、変更されたかどうかを 100 ミリ秒ごとに確認することをお勧めします。 IE のすべてのバージョン。

    if (("onhashchange" in window) && !($.browser.msie)) { 
         window.onhashchange = function () { 
              alert(window.location.hash);             
         }            
         // Or $(window).bind( 'hashchange',function(e) {  
         //       alert(window.location.hash); 
         //   });              
    }
    else { 
        var prevHash = window.location.hash;
        window.setInterval(function () {
           if (window.location.hash != prevHash) {
              prevHash = window.location.hash;
              alert(window.location.hash);
           }
        }, 100);
    }
于 2011-06-28T15:27:13.187 に答える
2

ハッシュ イベントの代わりに別の方法を使用して、popstate をリッスンするのはどうですか。

window.addEventListener('popstate', function(event)
{
    if(window.location.hash) {
            var hash = window.location.hash;
            console.log(hash);
    }
});

この方法は、これまでに試したほとんどのブラウザーで正常に機能します。

于 2015-09-02T08:37:28.490 に答える
1

この小さなjQueryプラグインは非常に簡単に使用できます：https ：//github.com/finnlabs/jquery.observehashchange/

于 2012-08-08T06:50:33.617 に答える
0

私は Chris Coyier がそのハッシュの問題に対する解決策を持っていると思います。彼のスクリーンキャストを見てください:

動的コンテンツのベスト プラクティス

于 2010-06-22T05:24:01.310 に答える
0

機能の検出にはModernizrを使用します。一般に、jQuery はブラウザー機能の検出を提供します: http://api.jquery.com/jQuery.support/。ただし、hashchange はリストにありません。

Modernizrのwiki は、HTML5 機能を古いブラウザーに追加するためのライブラリーのリストを提供します。hashchangeのリストには、プロジェクトHTML5 History APIへのポインターが含まれています。これは、古いブラウザーで動作をエミュレートする場合に必要な機能を提供しているようです。

于 2013-05-09T10:06:51.203 に答える
0

これは@johnny.rodgersの更新版です

希望は誰かを助けます。

// ie9 ve ie7 return true but never fire, lets remove ie less then 10
if(("onhashchange" in window) && navigator.userAgent.toLowerCase().indexOf('msie') == -1){ // event supported?
    window.onhashchange = function(){
        var url = window.location.hash.substring(1);
        alert(url);
    }
}
else{ // event not supported:
    var storedhash = window.location.hash;
    window.setInterval(function(){
        if(window.location.hash != storedhash){
            storedhash = window.location.hash;
            alert(url);
        }
    }, 100);
}
于 2015-04-15T12:18:22.450 に答える