2016-10-17 18 views
0

JavaScriptやjQueryでの経験はあまりありませんが、年齢確認用ポップアップを作成しました。ユーザーが7日以内に訪問するとポップアップが表示されないように、「はいボタン」機能にクッキーを追加する必要があります。ここにはcodepen年齢確認用のポップアップにCookieを追加

私はjs-cookieを使用する必要があることを十分に調査しています。どのように実装するか分かりません。これは私が持っている限りです。

<!--HTML--> 
<div class="popup"> 
    <div class="popupWindow"> 
      <div class="popup_txt"> 
      <div class="row"> 
      <center><img src="images/logo.png" class="img-responsive" width="400px"></center> 
      </div> 
      <hr style="border-top: 1px solid #000;"> 
      <div class="row"> 
        <h2>Where You Born Before</h2> 
        <h1 class="text-center"><span id="date"></span>?</h1> 

      <div class="popup_img answer"> 
        <button class="popup_img_yes btn btn-primary btn-lg">Yes</button> 
        <button class="popup_img_no btn btn-primary btn-lg">No</button> 
        </div> 
      </div> 
    </div> 

jQuery(document).ready(function($) { 
jQuery(".popup_img_yes").click(function(){ 
jQuery(".popup").fadeOut(1200); }); 
}); 

私は何とか、次を使用する必要が推測しています:ここで

Cookies.set('name', 'value', { expires: 7 }); 
+2

[jQueryでクッキーを設定/解除するにはどうすればよいですか?](http://stackoverflow.com/questions/1458724/how-do-i-set-unset-cookie-with-jquery) –

答えて

0

はそれが仕事ができる方法の例です:

var Cookies2 = Cookies.noConflict(); 
 

 
$(".popup_img_yes").click(function() { 
 
    $(".popup").fadeOut(1200); 
 
    Cookies2.set('name', 'value', { expires: 7 }); 
 
});
<!--HTML--> 
 
<div class="popup"> 
 
    <div class="popupWindow"> 
 
    <div class="popup_txt"> 
 
     <div class="row"> 
 
     <center> 
 
      <img src="images/logo.png" class="img-responsive" width="400px"> 
 
     </center> 
 
     </div> 
 
     <hr style="border-top: 1px solid #000;"> 
 
     <div class="row"> 
 
     <h2>Where You Born Before</h2> 
 
     <h1 class="text-center"><span id="date"></span>?</h1> 
 

 
     <div class="popup_img answer"> 
 
      <button class="popup_img_yes btn btn-primary btn-lg">Yes</button> 
 
      <button class="popup_img_no btn btn-primary btn-lg">No</button> 
 
     </div> 
 
     </div> 
 
    </div> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 
 
<script src="https://github.com/js-cookie/js-cookie/blob/master/src/js.cookie.js"></script>

関連する問題