Помогите сократить js код

Malchishka

Client
Регистрация
10.11.2011
Сообщения
216
Благодарностей
36
Баллы
28
У меня на сайте есть картинки, которые периодически обновляются (затираю на сервере старые картинки новыми с помощью ZP), браузер их кеширует, поэтому под каждой картинкой я добавил кнопку, по клике на которую обновляется изображение в новости (не вся страница, а именно изображение).

Для этого использую найденный в интернете код:

$(document).ready (function(){
var p = 1;
var intervalId;
var time;

function startInterval(){
intervalId = setInterval(function(){
updateImage();
}, 900000);
}

$(".knopka").click(function(){
if (typeof intervalId !== "undefined"){
clearInterval(intervalId);
}
updateImage();
startInterval();
});

function updateImage(){
time = new Date();
p = time.getTime();
$(".knopochka").html('<img src="https://domen.ru/papka/kartinka1.jpg?' + p + '">');
}
});

В этом коде присутствует лишняя для меня функция в виде автоматического обновления картинки через указанный временной промежуток. Как правильно убрать лишний функционал, не повредив работоспособность кода?

И ещё вопрос: для каждой картинки, которую мне необходимо обновлять по кнопке, приходится вставлять аналогичный код, разное в них только переменные "knopka", "knopochka" и ссылка на картинку "https://domen.ru/papka/kartinka1.jpg". Можно ли как-то в один общий код вставлять несколько разных переменных или придётся так дальше и добавлять для каждой картинки отдельный код?

Доброму человеку готов спонсировать сегодняшнее пиво. :az:
 

silent

Client
Регистрация
05.04.2014
Сообщения
237
Благодарностей
85
Баллы
28
JavaScript:
$(document).ready(function () {
  let p
  let time

  $('button').click(function (e) {
    e.preventDefault()
    time = new Date()
    p = time.getTime()
    $(this).html(`<img src="https://domen.ru/papka/kartinka1.jpg?${p}">`)
  })
})
 
  • Спасибо
Реакции: Malchishka

Malchishka

Client
Регистрация
10.11.2011
Сообщения
216
Благодарностей
36
Баллы
28
JavaScript:
$(document).ready(function () {
  let p
  let time

  $('button').click(function (e) {
    e.preventDefault()
    time = new Date()
    p = time.getTime()
    $(this).html(`<img src="https://domen.ru/papka/kartinka1.jpg?${p}">`)
  })
})
Что-то у меня не получилось завести этот код - при нажатии на кнопку "Обновить" ничего не происходит.

В старом варианте я делаю такую обёртку картинки и кнопки в новости:

JavaScript:
<div align="center" class="knopochka"><img src="/papka/kartinka1.jpg" alt=""></div>
<div align="center"><button class="knopka">ОБНОВИТЬ</button></div>
В новом

JavaScript:
$(document).ready(function () {
  let p
  let time

  $('knopka').click(function (e) {
    e.preventDefault()
    time = new Date()
    p = time.getTime()
    $(this).html('<img src="https://domen.ru/papka/kartinka1.jpg?${p}">')
  })
})
Сделал так:

JavaScript:
<div align="center"><img src="/papka/kartinka1.jpg" alt=""></div>
<div align="center"><button class="knopka">ОБНОВИТЬ</button></div>
 

Кто просматривает тему: (Всего: 1, Пользователи: 0, Гости: 1)