3
<script>
function CurHash(){
    var id = parseInt(window.location.hash.replace("#", ""));
    alert(id);
}
</script>

<!-- START URL: test.htm#1 -->
<a href='#1' onClick='CurHash()'>#1</a>
<a href='#2' onClick='CurHash()'>#2</a>
<a href='#3' onClick='CurHash()'>#3</a>

現在test.htm#1にいて、リンク#2をクリックすると、アラートには2ではなく1の番号が表示され、URLのこのハッシュが2に変更された後、次に3をクリックすると、prevouse2が表示されます。 。

固定の高さでページコンテンツをスクロールするためにハッシュを使用しているため(アーキテクチャの問題によりアンカーを使用できません)、リンクのスクロールをクリックした後のこのような動作では、2回目のクリックでのみ発生するため、問題があります。これは完全に間違っています。 。

質問:ブラウザでページをリロードせずに、ハッシュを更新して更新された(previousではない)値を取得してさらに使用するにはどうすればよいですか(すでにページ上にスクロールするためのすべてのコンテンツ、サーバーからリロードするのは良い解決策ではありません)。

4

4 に答える 4

4

正確にはクロスブラウザではありませんが、必要に応じてクロスブラウザのハッシュ変更の回避策を取得できます。

<script>
$(window).on('hashchange load',function(){
    var id = parseInt(window.location.hash.replace("#", ""));
    alert(id);
});
</script>

<!-- START URL: test.htm#1 -->
<a href='#1'>#1</a>
<a href='#2'>#2</a>
<a href='#3'>#3</a>

バインドの使用:http: //jsfiddle.net/KdqWK/1/

使用: http: //jsfiddle.net/KdqWK/2/

于 2012-07-19T02:23:04.520 に答える
1

onpopstateおよびonhashchangeイベントリスナーを使用します。

<html>
<head>
<title>Untitled Document</title>
<script type="text/javascript">

    if (typeof window.onpopstate != 'undefined') {
        window.onpopstate = curHash;
    } else if (typeof window.onhashchange != 'undefined') {
        window.onhashchange = curHash;
    }

    function curHash() {
        var h = window.location.hash;
        if (h == '') return; // no hash. this is probably the first load
        h = h.substr(1); // hash always starts with #
        alert('hash: ' + h);
    }

</script>
</head>

<body>
<ul style="margin:0; padding:0;">
    <li><a href="#1">Click here for 1</a></li>
    <li><a href="#2">Click here for 2</a></li>
    <li><a href="#3">Click here for 3</a></li>
    <li><a href="#4">Click here for 4</a></li>
</ul>
</body>
</html>
于 2012-07-19T02:27:47.070 に答える
1

onclick で curHash を呼び出す代わりに、hash を設定した後に href で呼び出します。次のコードを見つけてください。

<a href='javascript:location.hash="#1";CurHash();'>#1</a>
<a href='javascript:location.hash="#2";CurHash();'>#2</a>
<a href='javascript:location.hash="#3";CurHash();'>#3</a>
于 2012-07-19T02:49:13.917 に答える
-1

URLのハッシュ値を設定できます

window.location.hash = '#newhash';

JS 変数を使用して、クリックされたリンクを保存し、それをコードに渡すこともできます...質問を誤解していない限り。

于 2012-07-19T02:31:20.437 に答える