2012-11-15 19 views
10

yakın eylem hatırlamak var. Sanırım bu bilgiyi bir çerezde saklamak zorundayım. İdeal olarak, bu çerez sadece o mevcut oturum için sürecek ve geri döndükten sonra kutu tekrar görünecektir., uyarı kutusu Kullanıcıların kapatma düğmesini tıkladığında hatırlayan bir Bootstrap uyarı kutusu oluşturmak çalışıyorum

Ben jQuery Çerez eklentisi kullanıyorum. /jquery-cookie-master'a yükledim. Eklenti found here olabilir.

Bu benim kod found here takip ederek bugüne kadar ne var olduğunu.

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script> 
<script src="/jquery-cookie-master/jquery.cookie.js"></script> 
<script> 
    function runOnLoad(){ 
     if($.cookie('alert-box') == null) { 
      $.cookie('alert-box', 'open', { expires: 7 }); 
     } else if($.cookie('alert-box') == 'close') { 
      $(".close").hide(); 
     } 

</script> 

HTML:

<body onload="runOnLoad()"> 

<div class="alert alert-info"> 
    <button type="button" class="close" data-dismiss="alert" href="hideMe.php" onclick="hideMe()">×</button> 
    <p> 
    <strong>FORUM UPGRADE:</strong> In light of our recent surge in popularity we upgraded our forum and unfortunately lost all the old threads in the process. 
    </p> 
    <p> 
    In an effort to kick-start the forum again we need your help. Sign up now and leave a post (it's free). Once we reach 100 threads every member will receive a special gift. 
    </p> 
    <p> 
    <a href="http://example.com/forum/#/entry/register"> 
     <strong>Sign up to the forum now</strong> 
    </a>. 
    </p> 
</div> 

</body> 

Ne yazık ki ben, söz konusu işlemin hatırlamaz kapatma düğmesini tıklayın ve ben sayfayı yenileyin eğer uyarı kutusu tekrar görünür working.When değil.

Neyi yanlış yaptım?

+0

Can

jQuery aşağıdaki kodu kullanabilirsiniz kullanarak etkinlik bağlamak için kimse yardım eder? – bennygill

cevap

12

Kod kodlarınıza ise

  • onload işlevi yalnızca kullanıcı uyarı kutusu kapattı zaman çerez ayarlamak istediğiniz beri garip çerez değerini ayarlama gibi görünüyor verir.

  • Düğmenizde href niteliği vardır. Bu geçersiz html kadar gerekli değildir.

basitçe gizlemek ve kullanıcı yakın tıkladığında değil bildiğiniz böylece yakın Düğmeye bir etkinlik bağlamak zorunda uyarı kutusu durumunu hatırlamak için Çözüm

.

// When document is ready replaces the need for onload 
jQuery(function($){ 

    // Grab your button (based on your posted html) 
    $('.close').click(function(e){ 

     // Do not perform default action when button is clicked 
     e.preventDefault(); 

     /* If you just want the cookie for a session don't provide an expires 
     Set the path as root, so the cookie will be valid across the whole site */ 
     $.cookie('alert-box', 'closed', { path: '/' }); 

    }); 

}); 

sadece doğru çerez değeri için kontrol etmelisiniz uyarı kutusu gizlemek ve kutuyu gizlemek için:

jQuery(function($){ 

    // Check if alert has been closed 
    if($.cookie('alert-box') === 'closed'){ 

     $('.alert').hide(); 

    } 

    // ... Binding code from above example 

}); 
+0

Birden çok div uyarısını nasıl uygularım? muhtemelen bu $ ile ama nasıl uygulanacağı hakkında hiçbir fikrim yok. Bunun için bir keman eklemek mümkün mü? – user2513846

+0

@ user2513846 Her benzersiz div uyarıcısına tanımlayıcı eklemenizi öneririm. yani uyarı-box-1 uyarı-box-2 vb – hitautodestruct

+0

Ama nasıl onları JS kodu ekleyebilirim? Ben SO üzerinde başka bir soru sormak öneririm – user2513846

İlgili konular