onclickでデフォルトのaddClass関数を回避し、指定された日付に関数を返す方法

Question

リンクをクリックして表示するには、その曜日のリンクにクラスを動的に追加してリンクを表示します。クリックするとクラスが削除され、リンクが非表示になり、曜日が返されるまで非表示になります。

これは私が試みたものです。

jQuery(function($) { 
var day = new Date().getDay(); 

if(day == 4) { 
    $(".link").addClass("shown"); 
} 
$(".link").click(function(e) { 
    e.preventDefault(); 
    $(this).removeClass("shown"); 
}); 
}); 

それは限り、リンクが表示されたら、ページをリロード、24時間の期間が存在するとして、クリックされたときに正しく削除されますが。目標を達成するための正しいコーディングは何でしょうか？

Answer 1

、そして私のコメントは、ここではクッキーを使って行うことができる方法の基本的な例です：

https://jsfiddle.net/L9ojth2n/1/は、このの作業バージョンを持っています。

まず、クリックで、それをリンクされている確認して、次の日の深夜に期限切れクッキー（場合には、あなたがリンクに複数の曜日を表示したい）として保存：

var expires=new Date(); 
expires.setDate(expires.getDate()+1); 
expires.setHours(0); 
expires.setMinutes(0); 
expires.setSeconds(0); 
expires.setMilliseconds(0); 
document.cookie="clickedLink"+$(".link").index(this)+"=yes;expires="+expires.toUTCString()+";path=/"; 

ハイテクに精通したユーザーは、これを弱体化させることができるかもしれ

if(document.cookie.split(';').reduce(function(object,cookie){ 
    var data=cookie.split('='); 
    object[data[0].trim()]=data[1]; 
    return object; 
},{})['clickedLink'+$('.link').index(this)]!="yes"){ 
    $(this).addClass("shown"); 
} 

注意し、表示がで複数回リンク：そして第二に、あなたは次のリンクを可視化する際に、リンクのいずれかが既にクリックされているかどうかを確認するためにクッキーをチェッククッキーを削除すると特定のユーザーには、ログインを要求し、サーバーにデータを格納するのが最も安全です。

Answer 2

はい、既にリンクをクリックしているユーザーのレコードを保存する必要があります。ページはすべてのスクリプトをリロードしてすべての変数などを再設定するので、いくつかの他の手段によって「長寿命」のデータを保存する必要があります。

1. 通常、以前は、そのデータをユーザーのコンピュータに保存するためにCookieを使用していました。
2. 現代のブラウザは、Cookieなどのユーザーのコンピュータにデータを保存するための非常に単純な構文を持つローカルストレージをサポートしています。しかし、HTML5が必要です。
3. サーバーコードの情報を何らかの形で保存する（SQLに保存する、またはサーバーのドキュメント（txt、xml、csv）など）に保存する（この時点でユーザーのマイクがクリックした日時） ）、ページをロードするときにその詳細をJavaScriptに送信する
4. URLにクエリまたはハッシュパラメータとして格納することができます。これは、ユーザーが変更または消去できるため、そこに依存することはできません

は、これらのどれが目標を達成するための正しい方法でしょう。あなたはそれを期待するとき（または存在しない）、とそれぞれがうまくどこでも文書化されている。

の乾杯louisik1の答えに拡大