0

したがって、私のサイトのヘッダーには、さまざまなページの子ページにリンクするドロップダウン メニューがあります。メインボタンのリンクabout.phpやホバーメニューのリンクabout.php#contactsなど...

子ページであるこれらの各ページでは、個別のページではなく、javascript 関数を使用してオン/オフを切り替えて表示 css 値を変更します。

したがって、インデックスにいるときに をクリックするabout.php#contactsと、連絡先の内容が問題なく表示されます。ただし、私が about ページにいる場合、about ページへのハッシュを含むリンクは機能しません。他のページでは機能しますが、ハッシュ リンクが現在のページを指している場合は機能しません。アドレスバーで URL が変更されますが、新しいコンテンツを表示するには、ページまたはスクリプトを強制的にリロードする必要があると推測しています。

これが私が使用している関連コードです。私がやろうとしていることを達成するためのより良い方法はありますか?

//Drop down
<ul><li><a href="about.php">About Us</a>
<ul><li><a href="about.php#profile">contacts</a></li>
//More..
</ul></li></ul>

//Menu on  the page
<ul>
<li><a href="javascript:showlayer('contacts');"><span>Contacts</span></a></li>
//More
</ul>

//Javascript code that handles everything
<script language="javascript">
var hash = window.location.hash;
var selectedDiv = hash.split('#')[1];
if(selectedDiv != null)
{
    showlayer(selectedDiv);
}
function showlayer(name){
    document.getElementById("contacts").style.display = "none";
    //More
    document.getElementById(name).style.display = "block";  
}
</script>
4

1 に答える 1

1

別のハッシュで現在のページを指すリンクをクリックしても、ページは再読み込みされません。

hashchange代わりに、イベントにハンドラーを追加し、そこでコードを実行する必要があります。

:targetさらに良いことに、コードを完全にCSSセレクターに置き換えます。

于 2013-02-26T23:18:26.860 に答える