2017-06-26 3 views
2

前location.hashのみ、このスクリプトタグを含むページを検討変更:あなたはgoogle.comに行く場合は、そのページをロードページロード

<script type="text/javascript"> 
    window.location.hash = 'testing'; 
    window.history.back(); 
</script> 

を、あなたはアドレスにハッシュ更新が表示されますバーが表示されますが、ページはGoogleに戻ります。私はそれがちょうど#testingハッシュを取り除くことを期待する。私は長いタイムアウトでそれをラップした場合


は、それが期待どおりに動作:

<script type="text/javascript"> 
    setTimeout(function() { 
    window.location.hash = 'testing'; 
    window.history.back(); 
    }, 1000); 
</script> 

アドレスバーを簡単#testingハッシュを点滅させ、それが削除されます。


これは、ある時点で、location.hashの変更が履歴apiに伝播されることを意味します。この動作が変更されたときに起動するイベントがいくつかあります。

私はMDNのイベントのリストを見て、これらを見つけた:

pageshow

:セッション履歴のエントリがに横断しているときpageshowイベントが起動されます。
load:リソースとその依存リソースのロードが完了すると、ロードイベントが発生します。

いずれのイベントもこの問題を解決しません。私は試しました:

<script type="text/javascript"> 
    window.addEventListener('pageshow', function() { 
    window.location.hash = 'testing'; 
    window.history.back(); 
    }, false); 
</script> 

そしてloadイベントと同じです。アドレスバーに#testingハッシュが点滅し、ブラウザは前のページに戻ります。


にはどうすればlocation.hashの修正は行うことが安全であるかどうかを検出することができますか?

+0

私はこれがブラウザの "機能"だと思うので、ユーザーが混乱することはなく、ハッシュがすぐに変更されたときに戻るボタンが機能しないと思います。 – styfle

答えて

1

loadイベントは正しい軌跡にあるようですが、少し歪んでいるようです。ヒストリーAPIは、ロードイベントの後に1回の変更でをピックアップします。

<script type="text/javascript"> 
    window.addEventListener('load', function() { 
    window.location.hash = 'testing'; 
    window.history.back(); 
    }, false); 
</script> 

しかし、このコードは正しくハッシュを削除します:このコードで

には問題がある

<script type="text/javascript"> 
    window.addEventListener('load', function() { 
    setTimeout(function() { 
     window.location.hash = 'testing'; 
     window.history.back(); 
    }, 1); 
    }, false); 
</script> 

私はなぜこれがわからない、と私はそのいずれかの仕様を見つけることができませんこれが事実だと言いますが、これは試行錯誤の後に私が見つけたものです。

関連する問題