Ситуация такая:
на сайте есть ссылка, по нажатии на которую происходит длительное формирование архива. Чтобы предупредить пользователя об это использовался скрипт с использованием jQuery:
$(document).ready(function()
{
$('#link').click(function()
{
document.getElementById('loader').style.display = "block";
$("#loader").oneTime("30s", function()
{
$(this).hide(2500);
});
})
});
вызывалась функция из html:
<a href="http://javascript.ru" id="link">Сформировать архив</a>
По нажатию на эту ссылку на экране появлялся скрытый до этого div с id="loader" и исчезал через некоторое время (2500ms).
Теперь появилась необходимость в бОльшем количестве таких ссылок, причем количество их для каждого пользователя может быть разным. И тут этот вариант уже не подходит, так как работает только для первой ссылки. При нажатии на ссылки с таким же id, но ниже первой скрытый div не появляется.
Как сделать правильно? Необходимо ссылкам поменять id на class:
<a href="http://javascript.ru" class="link">Сформировать архив</a>
а в javascript поменять символ # на . перед названием класса ссылки
$(document).ready(function()
{
$('.link').click(function()
{
document.getElementById('loader').style.display = "block";
$("#loader").oneTime("30s", function()
{
$(this).hide(2500);
});
})
});
Может кому-то поможет.