0

非表示のインライン div を表示するためにクリック イベントを使用しています。私は現在、Ben Alman の Jquery hashchange イベントhttp://benalman.com/projects/jquery-hashchange-plugin/を使用して、ブラウザの前後ボタンに URL のハッシュタグ リンクが表示されるようにしています。問題は、前後に移動しても非表示の div が非表示のままであり、それらを表示する必要があることです。

HTML:

<ul>
<li><a href="#link1">Link 1</a></li>
<li><a href="#link2">Link 2</a></li>
<li><a href="#link3">Link 3</a></li>
<li><a href="#link4"><Link 4</a></li>
</ul>

<div id="div1"></div>
<div id="div2"></div>
<div id="div3"></div>
<div id="div4"></div>

脚本：

$("#link1").click(function() {
    $("#div1").fadeIn("400");
    $("#div2, #div3, #div4").hide(); 
});
$("#link2").click(function() {
    $("#div2").fadeIn("400");
    $("#div1, #div3, #div4").hide();
});
4

1 に答える 1

0

hashchange プラグインを変更しても問題ない場合は、jQuery アドレスをお勧めします。
ここを参照してください http://www.asual.com/jquery/address/

ハッシュの変更をキャッチするには、次のように記述します。

$.address.change(function(event) {
    // Your code here
});

この hashchange 関数の良いところは、プラグインが常にdocument.readyの後に呼び出されることを保証することです。

event.pathNames[0]が必要なハッシュになります。change hadnler 内で使用して、目的の div を表示できます。

このデモを参照してください(必要な機能を正確に実行すると思います。ブラウザのボタンで確認してください):
http://www.asual.com/jquery/address/samples/api/

サンプルの使用法: http://www.asual. com/jquery/address/docs/#sample-usage

于 2012-09-12T02:50:13.373 に答える