jquery.cookieを利用しての表示

cookieを使用した表示内容の変更を行おうとしています
たとえば

<a href="javascript:void(0);" onclick="Display('no1')">ID1</a>
を押したら
<div id="ID1"><p>これはID1のエリアです</p></div>
が出てきて、cookieが残っている限り上記文章が表示されている

以前の質問に載っていたソースを使用し、製作しようと思っていたのですが
リンク部分を下記のようにすると

<a href="javascript:void(0);" onclick="Display('no1')">ID1</a>
↓
<a href="next.html" onclick="Display('no1')">ID1</a>

当たり前といえば当たり前なのですが
リンクをクリックした際に、切り替わったエリアが一瞬表示し
ページに移動してしまいます
私としてはページが移動した後に切り替わってほしいのですが
なかなか上手くいきません
何か良い方法はないでしょうか・・・

下記元ソースになります

<script type="text/javascript">

function Display(no){
switch(no){
case 'no1':
$("#ID1").show();
$("#ID2").hide();
$("#ID3").hide();
$.cookie('area',no,{expires:1});
break;
case 'no2':
$("#ID1").hide();
$("#ID2").show();
$("#ID3").hide();
$.cookie('area',no,{expires:1});
break;
case 'no3':
$("#ID1").hide();
$("#ID2").hide();
$("#ID3").show();
$.cookie('area',no,{expires:1});
break;
}
}

$(function($){
if($.cookie('area')){
Display($.cookie('area'));
}else{
Display('no1');
}
});

</script>

<h5><a href="javascript:void(0);" onclick="Display('no1')">ID1</a></h5>
<h5><a href="javascript:void(0);" onclick="Display('no2')">ID2</a></h5>
<h5><a href="javascript:void(0);" onclick="Display('no3')">ID3</a></h5>
<div id="ID1"><p>これはID1のエリアです</p></div>
<div id="ID2"><p>これはID2のエリアです。</p></div>
<div id="ID3"><p>これはID3のエリアです。</p></div>

No.1 ベストアンサー 回答者： taloo 回答日時： 2011/08/22 02:42

ページを切り替えた後、next.htmlのwindow.onloadで表示する処理を行ってください。

この回答へのお礼

回答ありがとうございます！
さっそくやってみます。

お礼日時：2011/08/22 08:31