2011-12-22 13 views
0

以下のコードでは、一部のdivをフェードアウトしていますが、ページをリロードするとdivが再び表示されます。私はそれが起こることを望んでいません。私が必要とするのは、ユーザーが戻るボタンまたはホームリンクをクリックすると、元の形式に戻る必要があります。そうしないと、ページがリロードされたときにdivが非表示になっている必要があります。以下jquery fadeoutが解決しない

$(document).ready(function() { 
    $("#prodoneid").click(function() { 
     $("#sliderid, .prodcls").fadeOut(250); 
    }); 
}); 

私のhtmlコードは、あなたがdiv要素がいずれかのクッキーやHTML5のローカルストレージに隠されているという事実を保存する必要があります(新しいブラウザのみ)、保存されたプロセスになる

<div id="prodoneid" class="prodcls"> <img src="images/zara/thumbnails/1.png" alt="ZARA"/> </div> 

    <div id="prodtwoid" class="prodcls"> 
    <img src="images/zara/thumbnails/2.png" alt="ZARA"/> 
    </div> 

    <div id="prodthreeid" class="prodcls"> 
    <img src="images/puma/thumbnails/1.png" alt="PUMA"/> 
    </div> 

    <div id="prodfourid" class="prodcls"> 
    <img src="images/hermes/thumbnails/1.png" alt="HERMES"/> 
    </div> 

</div> 
+0

JS +クッキーがあなたを助けるかもしれません。 – Damp

+1

クッキーを使用してください。 nom nom nom http://stackoverflow.com/questions/6524277/when-link-clicked-make-a-div-appear-and-save-the-hide-show-options-in-cookie –

答えて

5

です以前に保存した状態にページを復元するためにページが読み込まれたときの情報ブラウザはあなたのためにそれをしません。

Webページは通常、クライアント上でステートレスです。彼らはあなた自身のページにクライアント側の状態を設計しない限り、毎回同じことをサーバからロードすることになっています。そのため、クライアント側の状態を作成したい場合は、その状態をサーバーに格納し(しばしばajaxを使用)、その特定のビューアによって再度ロードされたときにその状態をページに戻す必要があります。または、ローカルブラウザ(一般にクッキーやHTML5ローカルストレージを使用)に状態を保存し、ページが読み込まれたときにそこから取り出して、ページを目的の状態にする必要があります。

は、ここでは、このためにクッキーを使用するためのいくつかの擬似コードです:jQueryのために

$(document).ready(function() { 
    /* read the cookie "sliderHidden" and if it's is set to 1, 
     then: */ 
    $("#sliderid, .prodcls").hide(); 


    $("#prodoneid").click(function() { 
     $("#sliderid, .prodcls").fadeOut(250); 
     /* write a cookie called "sliderHidden" set to 1 
      that remembers that that these items are hidden */ 
    }); 
}); 

cookie plug-inはクッキーを読み出し/書き込みすることが容易になりますことがあります。

+0

thanxかわいそうだよね – sajid

+0

あなたが編集したコードが何をしているのかは、最初に#sliderと.prodclsを隠しています。私の#prodoneidは.prodclsにありますので、何もクリックしません。 – sajid

+0

これはあなた自身のコードです。 。質問にHTMLを追加し、隠したいものを記述したい場合は、適切なjQueryをアドバイスして、必要なものだけを隠すことができます。 – jfriend00

4

あなたfadeOutを使用する必要がありますが、あなたはにページが読み込ま間の設定を持続できるよう、最先端技術の一部になりたい場合は、また、クッキーなどの技術、またはHTML5のlocalStorageを使用する必要があります。

要素がある場合は、選択した状態を書き留めてください。ページが読み込まれると、以前の状態が存在するかどうかを確認する必要があります。必要であればhide() div。

localStorage hereおよびcookies hereについて詳しく読むことができます。低レベルのクッキーインターフェイスを抽象化するAjQuery pluginが存在し、興味のあるものが見つかるかもしれません。

現実的には、localstorageを使用しようと試みるthis pluginを見るのが最適かもしれませんが、現在のブラウザではサポートされていない場合はクッキーに戻ります。

+0

thanxおはよう良いよ – sajid

1

要素の「非表示」状態を保存するには、何らかの種類のCookieを使用する必要があります。 jQuery cookie plugin(http://archive.plugins.jquery.com/project/Cookie)を探します。

0

Hm- HTMLは静的です!

私はあなたがセッション(プログラム言語に依存する)またはクッキーによってこれを処理しなければならないと思います。 Cookieの

で見て:あなたはセッション状態変数やクッキーのいくつかの種類を使用して検討することもできthis tutorial

0

、それはしかし、弱いソリューションです。あなたの質問はあまり明確ではないかもしれません。あなたのページやビューモデル(ここではMVCと仮定します)の構造を再検討するのがよいでしょう。

+0

あなたが良い答えを出したいのであれば、答えに尋ねるのではなく、クエストにコメントしてOPの正確な必要性に関する追加の質問をすることができます。ほんの一部のフレンドリーアドバイス。 – jlafay

関連する問題