Перерисовка страницы во время выполнения скрипта

@Levabala · Регистрация: 28.06.2013

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

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
function start(){
    for (var i = 0; i <4; i++){setTimeout(starting, 1000, i);}
}
function starting(n){
    if (n == 0) {
        var cb1 = document.getElementById("cb1").checked = true;
        //alert("cb1 отключён!");
        var tx1 = document.getElementById("tx1");
        tx1.innerHTML += " Отмечен!";
    }
    if (n == 1) {
        var cb2 = document.getElementById("cb2").checked = true;
        //alert("cb2 отключён!");
        var tx2 = document.getElementById("tx2");
        tx2.innerHTML += " Отмечен!";
    }
    if (n == 2) {
        var cb3 = document.getElementById("cb3").checked = true;
        //alert("cb3 отключён!");
        var tx3 = document.getElementById("tx3");
        tx3.innerHTML += " Отмечен!";
    }
    if (n == 3) {
        var cb4 = document.getElementById("cb4").checked = true;
        //alert("cb4 отключён!");
        var tx4 = document.getElementById("tx4");
        tx4.innerHTML += " Отмечен!";
    }
}

HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
<html>
<body onClick="add(0)" onload="start()">
    <h1 align="center" style="color: red">Добавление элементов в <s> Div</s> Textarea</h1>  
    <pre><input type="text" value="textbox" id="tb1" MaxLength="20"><input type="text" value="height" id="tb2" MaxLength="10" size="10" onchange="canvas_wigth()">
    
    <input type='checkbox' onchange="check10(this)" id="cb1" name='value1' value='1'><a id="tx1">Содержимое после первой кнопки</a>
    <input type='checkbox' onchange="check10(this)" id="cb2" name='value2' value='2'><a id="tx2">Содержимое после второй кнопки</a>
    <input type='checkbox' onchange="check10(this)" id="cb3" name='value3' value='3'><a id="tx3">История кликов</a>
    <input type='checkbox' onchange="check10(this)" id="cb4" name='value4' value='4'><a id="tx4">Canvas</a>
    
    <input type="button" value="добавить содержимое textbox в div" onclick="add(1)"> 
    <input type="button" value="продублировать содержимое div" onclick="add(2)">
    </pre><br>
    <ul style="color: green;">Содержимое, добавленное кликом на первую кнопку</ul>
    <ul><textarea rows="20" cols="22    " id="maindiv" readonly="readonly"  onclick="add(3)"></textarea>
    Внимание!!! Справа от нас (мы тут) находится СANVAS!!!
    <canvas id="canvas" width="500" height="320" style="border:3px inset aqua;">
            У вас не поддерживается canvas!!!
    </canvas></ul>
    <ul style="color: darkblue;">Содержимое, добавленное кликом на вторую кнопку</ul>
    <ul><textarea rows="8" cols="60" id="secondul" readonly="readonly"  onclick="add(3)"></textarea></ul>
    <ul style="color: grey;">История кликов (1 - количество всего добавленных элементов 2 - тип клика)</ul>
    <ul><textarea rows="10" cols="60" id="div_value" readonly="readonly"  onclick="add(3)"></textarea></ul>
</body>
</html>

При загрузке страницы запускается функция start(), она вызывает функцию starting(n), в которую передаёт номер checkbox, который нужно отметить. starting(n) включает checkbox и пишет сбоку от него "Отмечен!". Так цикл пробегается по всем четырём чекбоксам. Но отрисовываются всё сделанное после выполнения скрипта

, а мне нужно, чтобы сразу же после задачи параметра!

@newJS · 07.11.2013, 22:08

в лоб браузеры так не могут, можно попробовать через таймер с нулевым временем
как то так

JavaScript
1
2
что то делаем
setTimeout(продолжение, 0);

@Levabala · 08.11.2013, 15:11 **[ТС]**

Спасибо! Решил так:

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
function start(){
    /*for (var i = 0; i <4; i++){*/setTimeout(starting, 1000, i);//}
}
function starting(n){
    if (n == 0) {
        var cb1 = document.getElementById("cb1").checked = true;
        //alert("cb1 отключён!");
        var tx1 = document.getElementById("tx1");
        tx1.innerHTML += " Отмечен!";
        setTimeout(starting, 1000, 1);
    }
    if (n == 1) {
        var cb2 = document.getElementById("cb2").checked = true;
        //alert("cb2 отключён!");
        var tx2 = document.getElementById("tx2");
        tx2.innerHTML += " Отмечен!";
        setTimeout(starting, 1000, 2);
    }
    if (n == 2) {
        var cb3 = document.getElementById("cb3").checked = true;
        //alert("cb3 отключён!");
        var tx3 = document.getElementById("tx3");
        tx3.innerHTML += " Отмечен!";
        setTimeout(starting, 1000, 3);
    }
    if (n == 3) {
        var cb4 = document.getElementById("cb4").checked = true;
        //alert("cb4 отключён!");
        var tx4 = document.getElementById("tx4");
        tx4.innerHTML += " Отмечен!";
    }
}

Новые блоги и статьи Все статьи Все блоги /
Уведомление о неверно выбранном значении справочника Maks 06.04.2026 Алгоритм из решения ниже реализован на примере нетипового документа "НарядПутевка", разработанного в конфигурации КА2. Задача: уведомлять пользователя, если в документе выбран неверный склад. . .	Установка Qt Creator для C и C++: ставим среду, CMake и MinGW без фреймворка Qt 8Observer8 05.04.2026 Среду разработки Qt Creator можно установить без фреймворка Qt. Есть отдельный репозиторий для этой среды: https:/ / github. com/ qt-creator/ qt-creator, где можно скачать установщик, на вкладке Releases:. . .	AkelPad-скрипты, структуры, и немного лирики.. testuser2 05.04.2026 Такая программа, как AkelPad существует уже давно, и также давно существуют скрипты под нее. Тем не менее, прога живет, периодически что-то не спеша дополняется, улучшается. Что меня в первую очередь. . .	Отображение реквизитов в документе по условию и контроль их заполнения Maks 04.04.2026 Алгоритм из решения ниже реализован на примере нетипового документа "ПланированиеСпецтехники", разработанного в конфигурации КА2. Данный документ берёт данные из другого нетипового документа. . .
Фото всей Земли с борта корабля Orion миссии Artemis II kumehtar 04.04.2026 Это первое подобное фото сделанное человеком за 50 лет. Снимок называют новым вариантом легендарной фотографии «The Blue Marble» 1972 года, сделанной с борта корабля «Аполлон-17». Новое фото. . .	Вывод диалогового окна перед закрытием, если документ не проведён Maks 04.04.2026 Алгоритм из решения ниже реализован на примере нетипового документа "СписаниеМатериалов", разработанного в конфигурации КА2. Задача: реализовать программный контроль на предмет проведения документа. . .	Программный контроль заполнения реквизитов табличной части документа Maks 02.04.2026 Алгоритм из решения ниже реализован на примере нетипового документа "СписаниеМатериалов", разработанного в конфигурации КА2. Задача: 1. Реализовать контроль заполнения реквизита. . .	wmic не является внутренней или внешней командой Maks 02.04.2026 Решение: DISM / Online / Add-Capability / CapabilityName:WMIC~~~~ Отсюда: https:/ / winitpro. ru/ index. php/ 2025/ 02/ 14/ komanda-wmic-ne-naydena/