Próbuję utworzyć pole alertu Bootstrap, które pamięta, gdy użytkownik kliknie przycisk zamykania. Chyba muszę przechowywać te informacje w pliku cookie. Najlepiej, by plik cookie trwał tylko dla bieżącej sesji, a następnie, aby je ponownie wyświetlić, pojawi się ponownie.Korzystanie z programu Bootstrap, pole ostrzeżenia zapamiętaj zamknij działanie

Używam wtyczki jQuery-Cookie. Przesłałem go do /jquery-cookie-master. Wtyczka może być found here.

To jest to, co mam do tej pory podążając za kodem found here.

<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>

Niestety to nie working.When klikam przycisk zamykania nie pamiętać, że działanie i gdybym odśwież stronę alert box pojawi się ponownie.

Co zrobiłem źle?

Źródło

2012-11-15 bennygill

Can ktoś pomoże? – bennygill

Kod wystawia

W kodów onload funkcja wydaje się być ustawienie wartości cookie, który jest dziwne, ponieważ chcesz tylko ustawić plik cookie, kiedy użytkownik zamknie okno alertu.
Twój przycisk ma atrybut href. Nie jest to konieczne, a także nieprawidłowy html.

Rozwiązanie

W celu po prostu ukryć i zapamiętywania stanu alarmowego polu trzeba powiązać zdarzenie do ścisłej przycisk, aby wiedzieć, kiedy użytkownik kliknie blisko.

Aby powiązać zdarzenie jQuery można użyć następującego kodu:

// 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: '/' }); 

    }); 

});

Aby ukryć powiadomienie pole należy po prostu sprawdzić prawidłowość wartości ciasteczka i schować etui:

jQuery(function($){ 

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

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

    } 

    // ... Binding code from above example 

});

Źródło

2012-12-04 09:07:47 hitautodestruct

Jak mogę zastosować te wielokrotne alarmy div? prawdopodobnie z $ this, ale nie ma pojęcia, jak to zaimplementować. Czy mógłbyś dodać do tego skrzypce? – user2513846

@ user2513846 Sugerowałbym dodawanie identyfikatorów do każdego unikalnego alarmu div. np. alert-box-1 alert-box-2 itd. – hitautodestruct

Ale jak dodać je do kodu JS? (przepraszam, nie mam doświadczenia ze składnią) – user2513846

Korzystanie z programu Bootstrap, pole ostrzeżenia zapamiętaj zamknij działanie

Odpowiedz

Kod wystawia

Rozwiązanie

Powiązane problemy