Автоматическое обновление картинки

@YellowDuck · Регистрация: 18.01.2018

Студворк — интернет-сервис помощи студентам

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

Qwerty_Wasd · 30.04.2018, 16:31

YellowDuck, обновлялась, оставаясь той же? - Смысл? Или должна меняться? - определенное кол-во картинок? Откуда их брать? Что-то должно генерить массив\объект с картинками? Что? Вопрос сформулируйте нормально.

Добавлено через 15 минут
Для того, чтобы Вы поняли абстрактность своего вопроса, дам Вам пример того, что Вы попросили, картинка будет обновляться без перезагрузки страницы(чтобы это было видно буду просто менять размер каждое обновление) - песочница

HTML5
1
<img id="item" src="https://dummyimage.com/200x200/a3a3a3/000000.png&amp;text=%D0%BA%D0%B0%D1%80%D1%82%D0%B8%D0%BD%D0%BA%D0%B0" alt=""/><br/><span>blablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablabla</span>

JavaScript
1
2
3
4
5
6
7
var count=0;
(function(){  
  (count%2!=0)?item.src="https://dummyimage.com/200x200/a3a3a3/000000.png&text=%D0%BA%D0%B0%D1%80%D1%82%D0%B8%D0%BD%D0%BA%D0%B0":item.src="https://dummyimage.com/300x300/a3a3a3/000000.png&text=%D0%BA%D0%B0%D1%80%D1%82%D0%B8%D0%BD%D0%BA%D0%B0";
  count++;
  window.setTimeout(arguments.callee, 3000)
})();
window.onbeforeunload=()=>count=null;

Добавлено через 3 минуты
Текст на странице и изменение размера сделано для того, чтобы вы убедились что страница не перезагружается. Так-то код еще короче

HTML5
1
<img id="item" src="https://dummyimage.com/200x200/a3a3a3/000000.png&amp;text=%D0%BA%D0%B0%D1%80%D1%82%D0%B8%D0%BD%D0%BA%D0%B0" alt=""/>

JavaScript
1
2
3
4
(function(){
  item.src="https://dummyimage.com/200x200/a3a3a3/000000.png&text=%D0%BA%D0%B0%D1%80%D1%82%D0%B8%D0%BD%D0%BA%D0%B0";
  window.setTimeout(arguments.callee, 3000)
})();

@YellowDuck · 02.05.2018, 10:12 **[ТС]**

картинка должна меняться

Qwerty_Wasd · 02.05.2018, 12:31

YellowDuck, на что должна меняться? Сколько этих "что" будет? Что за контейнер их содержать должен?
Я с Вас как с партизана буду информацию вытягивать? Вопрос пожалуйста нормально сформулируйте

@msheal · 02.05.2018, 13:29

Qwerty_Wasd, arguments.callee устаревшее и при use strict работать не будет. Предлагаю исправить

JavaScript
1
2
3
4
5
6
7
8
9
(function(){
  let count = 0
  setInterval(() =>{
    count % 2 
      ? item.src="https://dummyimage.com/200x200/a3a3a3/000000.png&text=small" 
      : item.src="https://dummyimage.com/300x300/a3a3a3/000000.png&text=large"
    count++
  }, 3000)
})()

Qwerty_Wasd · 02.05.2018, 13:34

msheal,

Сообщение от msheal

arguments.callee устаревшее

благодарю, я уже в курсе. А вот ТС'у мне кажется пока далеко еще до use strict. Так что не критично.

Добавлено через 1 минуту
Опять же, пока .. не критично

@msheal · 02.05.2018, 13:38

Qwerty_Wasd, не критично в нашем случае, однако ТС вполне может неявно использовать строгий режим)

Qwerty_Wasd · 02.05.2018, 13:49

msheal, может и так. А может и нет. На тот момент когда я дописывал

Code
1
... window.setTimeout(

увидел , что по привычке не именовал ф-ю, тыкать обратно было лень. А потому использовал ссылку.

Добавлено через 1 минуту
Мы чего-то много воды льем на пустом месте. Будет отправлять в продакшн - увидит предупреждение\ошибку в консоли. Сам все поймет.

Добавлено через 39 секунд
И тупо сделает так

JavaScript
1
2
3
4
5
(function f(){  
  (count%2!=0)?item.src="https://dummyimage.com/200x200/a3a3a3/000000.png&text=%D0%BA%D0%B0%D1%80%D1%82%D0%B8%D0%BD%D0%BA%D0%B0":item.src="https://dummyimage.com/300x300/a3a3a3/000000.png&text=%D0%BA%D0%B0%D1%80%D1%82%D0%B8%D0%BD%D0%BA%D0%B0";
  count++;
  window.setTimeout(f, 3000)
})();

@msheal · 02.05.2018, 13:52

Не по теме:

Qwerty_Wasd, очень сомневаюсь что ТС знает что такое эти ваши продакшены =)

Qwerty_Wasd · 02.05.2018, 13:54

Не по теме:

msheal, о том и речь :)

Новые блоги и статьи Все статьи Все блоги /
Переходник USB-CAN-GPIO Eddy_Em 20.03.2026 Достаточно давно на работе возникла необходимость в переходнике CAN-USB с гальваноразвязкой, оный и был разработан. Однако, все меня терзала совесть, что аж 48-ногий МК используется так тупо: просто. . .	Оттенки серого Argus19 18.03.2026 Оттенки серого Нашёл в интернете 3 прекрасных модуля: Модуль класса открытия диалога открытия/ сохранения файла на Win32 API; Модуль класса быстрого перекодирования цветного изображения в оттенки. . .	SDL3 для Desktop (MinGW): Рисуем цветные прямоугольники с помощью рисовальщика SDL3 на Си и C++ 8Observer8 17.03.2026 Содержание блога Финальные проекты на Си и на C++: finish-rectangles-sdl3-c. zip finish-rectangles-sdl3-cpp. zip	Символические и жёсткие ссылки в Linux. algri14 15.03.2026 Существует два типа ссылок — символические и жёсткие. Ссылка в Linux — это запись в каталоге, которая может указывать либо на inode «файла-ИСТОЧНИКА», тогда это будет «жёсткая ссылка» (hard link),. . .
[Owen Logic] Поддержание уровня воды в резервуаре количеством включённых насосов: моделирование и выбор регулятора ФедосеевПавел 14.03.2026 Поддержание уровня воды в резервуаре количеством включённых насосов: моделирование и выбор регулятора ВВЕДЕНИЕ Выполняя задание на управление насосной группой заполнения резервуара,. . .	делаю науч статью по влиянию грибов на сукцессию anaschu 13.03.2026 прикрепляю статью	SDL3 для Desktop (MinGW): Создаём пустое окно с нуля для 2D-графики на SDL3, Си и C++ 8Observer8 10.03.2026 Содержание блога Финальные проекты на Си и на C++: hello-sdl3-c. zip hello-sdl3-cpp. zip Результат:	Установка CMake и MinGW 13.1 для сборки С и C++ приложений из консоли и из Qt Creator в EXE 8Observer8 10.03.2026 Содержание блога MinGW - это коллекция инструментов для сборки приложений в EXE. CMake - это система сборки приложений. Здесь описаны базовые шаги для старта программирования с помощью CMake и. . .

@YellowDuck 0 / 0 / 1 Регистрация: 18.01.2018 Сообщений: 29

	Автоматическое обновление картинки 30.04.2018, 11:31. Показов 5128. Ответов 9 Метки web (Все метки) Здравствуйте, необходимо сделать так, чтобы картинка автоматически обновлялась, без перезагрузки страницы. Как это можно сделать? 0

@YellowDuck 0 / 0 / 1 Регистрация: 18.01.2018 Сообщений: 29
	02.05.2018, 10:12 [ТС]
	картинка должна меняться 0

Qwerty_Wasd 2151 / 1496 / 651 Регистрация: 16.04.2016 Сообщений: 3,696
	02.05.2018, 12:31
	YellowDuck, на что должна меняться? Сколько этих "что" будет? Что за контейнер их содержать должен? Я с Вас как с партизана буду информацию вытягивать? Вопрос пожалуйста нормально сформулируйте 0

@msheal 707 / 309 / 191 Регистрация: 05.03.2015 Сообщений: 822
	02.05.2018, 13:38
	Qwerty_Wasd, не критично в нашем случае, однако ТС вполне может неявно использовать строгий режим) 0

@msheal
	02.05.2018, 13:52
	Не по теме: Qwerty_Wasd, очень сомневаюсь что ТС знает что такое эти ваши продакшены =) 0

Qwerty_Wasd
	02.05.2018, 13:54
	Не по теме: msheal, о том и речь :) 0

Автоматическое обновление картинки

Решение