<button class="progress-button" type="submit" data-style="rotate-side-down" data-perspective data-horizontal">Подробнее</button>
<button class="progress-button" data-uri="https://toster.ru/q/311167?e=3769167#comment_1058109" data-target="_blank">Как сделать задержку на открытие ссылки?</button>
<button class="progress-button" data-uri="http://yandex.ru" data-target="_self">Еще одна кнопка...</button>$(document).ready(function() {
$(function() {
var flag = new Boolean(true); // Защитит от частого нажатия на кнопку
// Клик
$('.progress-button').click(function(e) {
openUrl($(this));
e.preventDefault();
})
/**
* Открывает ссылку с задержкой
*
* @param {object} button - Нажатая кнопка
* @return {boolean}
*/
function openUrl(button) {
var delay = 2000, // Задержка 2 секунды
text = button.text(), // Текст который будет задан кнопке после окончания загрузки
uri = button.attr('data-uri'); // URL
// Проверяем не начата ли загрузка какой-либо ссылки
if (flag == true) {
flag = false;
// Показываем загрузку
button.text('загружаю...');
// С задержкой открываем URL, возвращая штатный текст кнопке, разрешаем открывать новые ссылки
setTimeout(function() {
flag = true;
button.text(text);
// Проверяем открыть ссылку в новом окне или в текущем
if (button.attr('data-target') === '_blank') {
window.open(uri);
return;
}
window.location = uri;
return;
}, delay);
}
return;
}
});
});
$('button').on('click', '.progress-button', function(e) {
e.preventDefault();
var url = $(this).data('src');
setInterval(function() {
window.location = url;
}, 3000);
});<!DOCTYPE html>
<html>
<head>
<script src="https://code.jquery.com/jquery-2.2.3.min.js"></script>
<script type="text/javascript">
jQuery(document).ready(function ($) {
$('.js-anchor').on('click', function(e) {
e.preventDefault();
var
href = $(this).attr('href'),
timeout = 5000;
setTimeout(function() {
//window.open(href, '_self');
location.href = href;
}, timeout);
});
});
</script>
</head>
<body>
<a class="js-anchor" href="http://yandex.ru">click me</a>
</body>
</html>
