2012-01-30 9 views
1

「新しいコメントが追加されました」というリンクが表示されているページがあります。次に、そのリンクを非表示にしたいリンクをクリックします。戻るボタンをクリックして自分のページに戻ったときに、そのリンクがまだ非表示になっていてほしい(私は今コメントを見ていて、もはや新しいものではない)。クリックしたときのリンクを隠す

これは簡単なjavascriptで行うことができますか?パフォーマンス上の理由から元のページをリロードしたくないクリックされたときに、リンクを非表示にする

+2

クッキーに表示/非表示にするリンクのリストを保持し、ページが読み込まれるとそのCookieに基づいて表示/非表示にする必要があります。ありがとうございました。 –

答えて

1

これはおそらく役に立つかもしれません。

使用していたプログラミング言語に応じて、セッション値が必要になります。例えば

、jQueryのを使用して、あなたがPHPを使用していたと仮定:

<?php 
//start the session 
session_start(); 

//set the attribute 
$_SESSION['hide'] = false; 

?> 
<script> 

//function to hide all class='test' elements 
function hide(h){ 
if(h){ 
    $('.test').hide(); 
} else { 
    $('.test').show(); 
} 
} 

/*do this always when page loads 
* verify with the value stored in session to hide or not the links 
*/ 
window.onload = hide(<?php echo $_SESSION['hide']; ?>); 

//onready 
$(function() { 

//when link class='test' is clicked 
$('.test').click(function(){ 

    //fadeOut or just $(this).hide(); 
    $(this).fadeOut(); 

    //set the session to hide = true 
    <?php $_SESSION['hide'] = true; ?> 

}); 

}); 
</script> 

//here goes your html 
<body> 
<a href="javascript:void(0);" title="Link" class="test">I am link 1</a> 
<br/><br/> 
<a href="javascript:void(0);" title="Link" class="test">I am link 2</a> 
<br/><br/> 
<a href="javascript:void(0);" title="Link" class="test">I am link 3</a> 
<br/><br/> 
<a href="javascript:void(0);" title="Link" class="test">I am link 4</a> 
</body> 

は私のアイデアはあなたのために働く願っています。

2

は簡単です:次のページのロードが少しより多くの作業が必要となりますため

var a = document.getElementById("yourA"); 
a.onclick = function(){ 
    this.style.display = "none"; 
    return false; 
}; 

隠し、それを維持するために。リンクを隠した後にクッキーを作成し、その後にページがロードされるたびに同じクッキーを読み込む必要があります(それに応じて非表示にする)。

+0

あなたがページに戻ったときにbfcacheがjavascriptの状態を保持しないのでしょうか? – MotoTribe

+0

@mototribe - 私は正直なところ、bfcacheがどのように動作するのかよくわかりません。 –

0

これは間違いなく基本的なJavaScriptで行うことができます。一般的に

、ここに必要な手順です:

  • レジスタは今、プリ書かれたコールバック
  • あなたのコールバックをクリックします使用してDOM要素にイベントハンドラを「クリック」して(それをイベントオブジェクトを渡します)
  • イベントオブジェクトの属性e.targetに基づいて要素を非表示にすることができます。
関連する問題