Как прекратить перенаправление с помощью кнопки закрытия с помощью JQuery

Question

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

Мой код:

HTML

<li><a href="/logout" id="log"><i class="zmdi zmdi-power"></i> <span>Log out</span></a></li>

JS

$('#log').click(function (e) {
            e.preventDefault();
            $(".close").remove();
            $(this).hide();
            $(".content").append('<div class="card " ><div class="alert alert-danger alert-dismissible fade show al"><button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">×</span></button>Oh snap! <a href="#" class="alert-link">Change a few things up</a> and try submitting again.</div></div>');
            setTimeout(function () {
                window.location.href = "/logout";
            }, 6000);
        });

Мой модал закрыт, но все еще перенаправляет меня. Кто-нибудь может мне помочь с этим?

Answer 1

HTML:

Если вы не измените href = "#", ваш редирект будет инициирован.изменение его на «#» будет ждать 6 секунд, давая вам время убить перенаправление при закрытии!

<li><a href="#" id="log"><i class="zmdi zmdi-power"></i> <span>Log out</span></a></li>

SCRIPT

var timer;
function cancelRedirect(){ 
   clearTimeout(timer)
}
$('#log').click(function (e) {
 ...
 timer = setTimeout(function () {
            window.location.href = "/logout";
        }, 6000);
 //On close click call cancelRedirect()
 ...
}       

Answer 2

Чтобы отменить выход с помощью кнопки «ОК», вам нужно изменить свой код следующим образом:

var logoutTimer;

$('#log').click(function (e) {
    e.preventDefault();
    $(".close").remove();
    $(this).hide();
    $(".content").append('<div class="card " ><div class="alert alert-danger alert-dismissible fade show al"><button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">×</span></button>Oh snap! <a href="#" class="alert-link">Change a few things up</a> and try submitting again.</div></div>');
    doLogout();
});

function doLogout(){
    logoutTimer = setTimeout(function () { window.location.href = "/logout"; }, 6000);
}

function cancelLogout(){
    clearTimeout(logoutTimer);
}

Теперь просто вызовите функцию cancelLogout() с помощью вашей кнопки:

onclick="cancelLogout();"