Показывать Jquery Popup только один раз

Question

Показывать Jquery Popup только один раз

0

У меня есть сайт, на котором пользователь должен войти в систему, и как только это будет сделано, они будут перенаправлены на новую страницу, и появится всплывающее окно. У меня нет проблем с отображением всплывающего окна, однако, если вы обновите страницу снова и снова, появится всплывающее окно. Я хочу, чтобы он отображался только после того, как они вошли в систему и никогда больше не появлялись после этого, пока они не выходят из системы. Это означает, что если они повторно обновили страницу или что-то подобное, всплывающее окно НЕ появится снова. Есть ли какой-то плагин или простой код для этого (я как бы новичок в JQuery)?

<div id="popup-image-back">
    <div class="popup-textbox">
        <div class="textbox-title">WEVE HAD A MAKEOVER!</div>
        <div class="textbox-p">With fewer restrictions, more destinations and even better rewards you can start saving more money!</div>
    </div>
    <img class="new-popup-xclose" src="images/close-x-dark.png" />
</div>
<div id="back-wrapper"></div>

JavaScript

$(document).ready(function () {
    $('#back-wrapper').fadeIn(1000, function () {
        $('#popup-image-back').fadeIn(1000);
    });
    $(".new-popup-xclose").click(function () {
        $('#popup-image-back').fadeOut(1000);
        $('#back-wrapper').fadeOut(1000);
    });
});

Joseph Montecalvo 24 фев. 2014, в 17:05

Источник

Теги:

jquery

popup

3 ответа

Ещё вопросы

ConceptsGroup.com · Answer 1 · 2014-07-09T10-14-00.000Z

Хотя эта ветка может быть древней, я хотел дать ответ, который OP мог бы использовать. Используя файлы cookie, вы можете настроить отображение страницы только один раз. Поскольку большинство браузеров поддерживают файлы cookie, это более надежно, чем использование внутреннего механизма хранения, которым обладают текущие браузеры.

$(document).ready(function(){

    // test for cookie here
    if ($.cookie('test_status') != '1') {
        //show popup here
        window.open('YOUR POPUP URL HERE','windowtest','toolbar=0,status=0,width=500,height=500');

        // set cookie here if not previous set
        var date = new Date();
        var minutes = 30;
        date.setTime(date.getTime() + (minutes * 60 * 1000));
        $.cookie('test_status', '1', {expires: date});
   }

});

Чтобы проверить это, обязательно очистите файлы cookie между каждым обновлением.

Milind Anantwar · Answer 2 · 2014-02-24T14-26-00.000Z

0

вы можете использовать localstorage для этого:

if (localStorage.getItem("iswrpdivloaded") === null) {
  $('#back-wrapper').fadeIn(1000,function(){
   $('#popup-image-back').fadeIn(1000);
});
localStorage.setItem('iswrpdivloaded', 1);
}

Milind Anantwar 24 фев. 2014, в 14:26

0

Есть ли какой-нибудь скрипт-тег или ссылка, которую я должен поместить в голову, чтобы этот код локального хранилища работал? Потому что я попробовал, и это не удалось.
Joseph Montecalvo 24 фев. 2014, в 15:32
0

Нет, ты не. Вам просто нужно убедиться, что браузер и версия поддерживает HTML5 (что почти во всех современных браузерах)
Milind Anantwar 24 фев. 2014, в 15:35
0

Тогда это странно, потому что это не работает. Я включил этот код в функцию document.ready, правильно?
Joseph Montecalvo 24 фев. 2014, в 15:44

Показать ещё 1 комментарий

Ravi · Answer 3 · 2014-02-24T13-02-00.000Z

Вы можете использовать это для всплывающего окна.

$(window).load(function(){
        $('.popUp').show();
        $('.close').click(function(){
            $('.popUp').slideUp();
        });
        setTimeout('$(".popUp").fadeOut()', 10000);
    });

Но каждый раз, когда я обновляю страницу, появляется всплывающее окно. Предполагается, что он будет отображаться только после входа пользователя в систему и никогда снова, если он не вышел из системы.