Поочерёдный вывод

@Defolto · Регистрация: 13.03.2018

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

Добрый день. Хочу, чтобы в теге <span> (да, у него id number) после загрузки страницы менялись цифры от 0 до 7. Но как всегда не работает, можете подсказать в чём косяк?

JavaScript
1
2
3
4
5
$(document).ready( function(){
    for (var i = 0; i < 8; i++) {
        $('#number').delay(i*300).html(i);   
    }
});

@Mr_Sergo · 06.03.2019, 17:33

Defolto,

Что вы хотите сделать?, на словах объясните.

@Defolto · 06.03.2019, 17:35 **[ТС]**

Чтобы когда загрузилась страница у неё менялись цифры от 0 до 7 прям перед пользователем.

@Mr_Sergo · 06.03.2019, 17:53

Defolto,

Так -> https://codepen.io/Mr_Sergo/pe... itors=1000 ??

PHP/HTML
1
2
3
4
5
6
7
8
9
10
11
<span id="number"></span>
<script>
    (() => {
        let i = 0; del();
        function del(){
            let timeout = setTimeout(del, 300*i);
            $('#number').html(i++);
            if(i > 7) clearTimeout(timeout);
        }
    })();
</script>

@Defolto · 06.03.2019, 17:54 **[ТС]**

А можете объяснить как это работает?

@Mr_Sergo · 06.03.2019, 17:55

Цикл с задержкой не получится сделать, у циклов немного другая задача

Добавлено через 21 секунду

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

можете объяснить как это работает?

да щас

@Defolto · 06.03.2019, 17:57 **[ТС]**

А можно уточнить, что за синтаксис на 3 строчке? Или хотя бы что она делает?

@Mr_Sergo · 06.03.2019, 18:02

Defolto,

JavaScript
1
2
3
4
5
6
7
8
(() => { // Вызываем анонимную функцию для того что бы переменные внутри нее (например i) не были глобальными
    let i = 0; del();  // Изначально i равна нулю
    function del(){  // Создаем функцию del
        let timeout = setTimeout(del, 300*i);  // Рекурсивно вызываем ее каждые 300мс умноженные на i
        $('#number').html(i++);  // Выводим i и прибавляем к ней с каждым проходом единицу
        if(i > 7) clearTimeout(timeout); // Если i больше 7 останавливаем функцию del
    }
})();

@Defolto · 06.03.2019, 18:03 **[ТС]**

Спасибо большое

@Mr_Sergo · 06.03.2019, 18:11

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

что за синтаксис на 3 строчке?

Стрелочные функции

JavaScript
1
2
3
() => {}
// аналог
function(){}

Добавлено через 6 минут
Для упрощенного понимания

JavaScript
1
2
3
4
5
6
7
$('.someClass').on('click',()=>{
    console.log(1);
});
 
$('.someClass').on('click',function(){
    console.log(1);
});

Одно и то же

Добавлено через 1 минуту
Defolto, только вы должны понимать что Jquery не всегда понимает стрелочные функции

@amr-now · 06.03.2019, 19:04

Defolto, Mr_Sergo, для относительно гарантированных равных интервалов удобнее использовать setInterval()

PHP/HTML
1
2
3
4
5
6
7
8
9
10
11
12
13
14
    <div id="number"></div>
    <script>
        $(document).ready(function () {
            var timerID,
                i = 0;
            func();
            timerID = setInterval(func, 300);
            function func() {
                $('#number').text(i++);
                if (i === 8)
                    clearInterval(timerID);
            }
        });
    </script>

Сколько читаю новых статей - в основном пишут, что jQuery создает ложное ощущение совместимости со старыми браузерами.

На самом деле jQuery имеет и большие минусы.
Он дает ложное ощущение, что новые версии JavaScript изучать не надо.
Вдобавок, для современных сайтов уже jQuery стало мало. Нужно использовать более крутые и сложные фреймворки.

@Mr_Sergo · 06.03.2019, 20:56

amr-now, хех...

не просто 300 а 300 умноженное на i

С каждой, условно говоря, итерацией, мс должны меняться в зависимости от i

@amr-now · 06.03.2019, 21:16

Mr_Sergo, у меня ощущение, что автору вопроса нужно просто менять цифры каждые 300 мс.

@Mr_Sergo · 06.03.2019, 21:20

amr-now, возможно, но мне интересней было сделать как у тс-а в коде по замыслу, я тоже сначала подумал а поставлю setInterval, но потом понял что не все так просто с этой i

меня это заинтересовало и я решил что все-таки сделаю с i

Новые блоги и статьи Все статьи Все блоги /
Настройки VS Code Loafer 13.04.2026 { "cmake. configureOnOpen": false, "diffEditor. ignoreTrimWhitespace": true, "editor. guides. bracketPairs": "active", "extensions. ignoreRecommendations": true, . . .	Оптимизация кода на разграничение прав доступа к элементам формы Maks 13.04.2026 Алгоритм из решения ниже реализован на нетиповом документе, разработанного в конфигурации КА2. Задачи, как таковой, поставлено не было, проделанное ниже исключительно моя инициатива. Было так:. . .	Контроль заполнения и очистка дат в зависимости от значения перечислений Maks 12.04.2026 Алгоритм из решения ниже реализован на примере нетипового документа "ПланированиеПерсонала", разработанного в конфигурации КА2. Задача: реализовать контроль корректности заполнения дат назначения. . .	Архитектура слоя интернета для сервера-слоя. Hrethgir 11.04.2026 В продолжение https:/ / www. cyberforum. ru/ blogs/ 223907/ 10860. html Знаешь что я подумал? Раз мы все источники пишем в голове ветки, то ничего не мешает добавить в голову такой источник, который сам. . .
Подстановка значения реквизита справочника в табличную часть документа Maks 10.04.2026 Алгоритм из решения ниже реализован на примере нетипового документа "ПланированиеПерсонала", разработанного в конфигурации КА2. Задача: при выборе сотрудника (справочник Сотрудники) в ТЧ документа. . .	Очистка реквизитов документа при копировании Maks 09.04.2026 Алгоритм из решения ниже применим как для типовых, так и для нетиповых документов на самых различных конфигурациях. Задача: при копировании документа очищать определенные реквизиты и табличную. . .	модель ЗдравоСохранения 8. Подготовка к разному выполнению заданий anaschu 08.04.2026 https:/ / github. com/ shumilovas/ med2. git main ветка * содержимое блока дэлэй из старой модели теперь внутри зайца новой модели 8ATzM_2aurI	Блокировка документа от изменений, если он открыт у другого пользователя Maks 08.04.2026 Алгоритм из решения ниже реализован на примере нетипового документа, разработанного в конфигурации КА2. Задача: запретить редактирование документа, если он открыт у другого пользователя. / / . . .

Поочерёдный вывод

Решение

Решение

@Mr_Sergo 2037 / 1096 / 409 Регистрация: 29.04.2016 Сообщений: 2,625
	06.03.2019, 17:33
	Defolto, Что вы хотите сделать?, на словах объясните. 0

@Defolto 20 / 13 / 9 Регистрация: 13.03.2018 Сообщений: 63
	06.03.2019, 17:35 [ТС]
	Чтобы когда загрузилась страница у неё менялись цифры от 0 до 7 прям перед пользователем. 0

@Defolto 20 / 13 / 9 Регистрация: 13.03.2018 Сообщений: 63
	06.03.2019, 17:54 [ТС]
	А можете объяснить как это работает? 0

@Defolto 20 / 13 / 9 Регистрация: 13.03.2018 Сообщений: 63
	06.03.2019, 17:57 [ТС]
	А можно уточнить, что за синтаксис на 3 строчке? Или хотя бы что она делает? 0

@Defolto 20 / 13 / 9 Регистрация: 13.03.2018 Сообщений: 63
	06.03.2019, 18:03 [ТС]
	Спасибо большое 0

@Mr_Sergo 2037 / 1096 / 409 Регистрация: 29.04.2016 Сообщений: 2,625
	06.03.2019, 20:56
	amr-now, хех... не просто 300 а 300 умноженное на i С каждой, условно говоря, итерацией, мс должны меняться в зависимости от i 0

@amr-now 6497 / 3908 / 2006 Регистрация: 14.06.2018 Сообщений: 6,781
	06.03.2019, 21:16
	Mr_Sergo, у меня ощущение, что автору вопроса нужно просто менять цифры каждые 300 мс. 0

@Mr_Sergo 2037 / 1096 / 409 Регистрация: 29.04.2016 Сообщений: 2,625
	06.03.2019, 21:20
	amr-now, возможно, но мне интересней было сделать как у тс-а в коде по замыслу, я тоже сначала подумал а поставлю setInterval, но потом понял что не все так просто с этой i меня это заинтересовало и я решил что все-таки сделаю с i 0