Вывод чисел при запуске документа html

@Erbe · Регистрация: 14.02.2014

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

Помогите сделать вывод уравнения в первый <div>
Вместо уравнения оно выводит "undefined". За его вывод отвечает функция displayQwestion()
Но зато в ответах уже выводит правильную функцию.

Код:

Кликните здесь для просмотра всего текста

PHP/HTML
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
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
<html>
<head>
<meta charset = "UTF-8">
</head>
 
<body>
<div id = "Qwestion">
 
</div>
<div> 
    <input type="text" id="answer" />
    <input type="button" value="Ответ"  onclick="check()" />
</div>
 
<hr />
Статистика текущего теста: <br /> 
<div id="currentStats">
 
</div>
 
<hr/>
Результаты: <br /> 
<div id="records">
</div>
 
 
 
<script type="text/javascript">
displayQwestion()
    var spanEl = document.getElementById("test");
    var answerEl = document.getElementById("answer");
 
 
    var maxNumber = 10;
    var maxSteps = 10;
var opSign = ["+", "-", "*"];
var opBonus = [1, 2, 3];
 
var results = [];
var players = [];
 
var currentResults = [];
var gameScore = 0;
var stepNum = 0;
 
var number1;
var number2;
var operation;
var questionStr;
 
function setup() {
    var maxS = parseInt(prompt("Введите макс число вопросов"));
    var maxN = parseInt(prompt("Введите ограничение по числу"));
 
    if (!isNaN(maxS)) {
        maxSteps = maxS;
    }
 
    if (!isNaN(maxN)) {
        maxNumber = maxN;
    }  
}
 
 
function start() {
 
    nextStep();
 
    
}
 
function check() {
    var answer = answerEl.value;
    var correctAnswer;
 
    switch(operation){
        case 0: 
            correctAnswer = number1 + number2;
            break;
        case 1: 
            correctAnswer = number1 - number2;
            break;
        case 2: 
            correctAnswer = number1 * number2;
            break;
    }
 
    if (correctAnswer == answer) {
        gameScore += opBonus[operation];
 
        questionStr += answer + "   Правильно!    +" + opBonus[operation] + "бал(а)";
    } else {
        questionStr += answer + "   HE Правильно!   (" + correctAnswer + ")";
    }
 
    currentResults.push(questionStr);
 
    displayCurrentStats();
 
    if (stepNum < maxSteps) {
        nextStep();
    } else {
        gameOver();
    }
}
 
function nextStep() {
    stepNum++;
 
    number1 = Math.round(maxNumber * Math.random());
    number2 = Math.round(maxNumber * Math.random());
    operation = Math.round(2 * Math.random());
 
    questionStr = number1 + " " + opSign[operation] + " " + number2 + " = ";
    
    spanEl.innerHTML = questionStr;
    answer.value = "";
}
 
function gameOver(){
    results.push(gameScore);
 
    players.push(prompt("Ваше имя?"));
 
    currentResults = [];
    gameScore = 0;
    stepNum = 0;
 
    displayCurrentStats();
 
    displayResults();
 
    nextStep();
}
 
 function displayQwestion() {
var divEl = document.getElementById("Qwestion");
 
    var html = "<ol>";
        html += "<li>" + questionStr;
 
divEl.innerHTML = html; 
}
 
 
 
function displayCurrentStats() {
    var divEl = document.getElementById("currentStats");
 
    var html = "<ol>";
    for (var i = 0; i < currentResults.length; i++) {
        html += "<li>" + currentResults[i] + "</li>";
    }
 
    html += "</ol>";
 
    divEl.innerHTML = html;
}
 
function sortNumber(a, b) {
    return a - b;
}
 
function displayResults() {
 
    results.sort(sortNumber);
 
    var divEl = document.getElementById("records");
 
    var html = "<ol>";
    for (var i = 0; i < results.length; i++) {
        html += "<li>" + Math.round(results[i]) + " балов у " + players[i] + "</li>";
    }
 
    html += "</ol>";
 
    divEl.innerHTML = html;
}
 
 
setup();
start();
 
</script>
 
 
</body>
</html>

@Ozick · 23.04.2016, 18:19

Erbe, ты меня прям вдохновил

(рекорды сам добавишь):

PHP/HTML
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
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
<html>
  <head>
  </head>
  <body bgcolor="AA5555" onload="rand();">
    <center>
      <div style="border: 2px outset silver; width: 350; height: 100; margin-top: 300px;">
        <p id="quest" value="345"></p>
        <hr style="border: dashed darkgray 1px; width: 330"/>
        <input type="text" id="input" placeholder="Введите ответ" size="15" onkeyup="filter(this)">
        <input type="button" onclick="check()" style="border: 3px groove" value="Проверка">
        <input type="button" onclick="refresh()" style="border: 3px groove;" value="Обновить">
      </div>
    </center>
  </body>
  <script>
  var first;
  var second;
  var symbolRand;
  var symbol;
  var result;
 
  function rand(){
    first = parseInt(Math.random()*9)+1;
    second = parseInt(Math.random()*9)+1;
    symbolRand = parseInt(Math.random()*3)+1;
    switch(symbolRand){
      case 1: symbol = "+"; result = parseInt(first + second); break;
      case 2: symbol = "-"; result = parseInt(first - second); break;
      case 3: symbol = "*"; result = parseInt(first * second); break;
    }
    document.getElementById("quest").innerHTML = first + " " + symbol + " " + second + " = ?";
  }
 
  function check(){
    if(document.getElementById("input").value != '') check_sec();
  }
 
  function check_sec(){
    if(document.getElementById("input").value == result){
      document.getElementById("input").style = "background: green";
      document.getElementById("quest").innerHTML = first + " " + symbol + " " + second + " = " + result;
    }
    else{
      document.getElementById("input").style = "background: red";
      document.getElementById("quest").innerHTML = first + " " + symbol + " " + second + " = " + result;
    }
  }
 
  function filter(text){
    text.value = text.value.replace(/[^-\d]*/g, '');
  }
 
  function refresh(){
    document.getElementById("quest").innerHTML = '';
    document.getElementById("input").value = '';
    document.getElementById("input").style = "";
    rand();
  }
  </script>
</html>

@Erbe · 24.04.2016, 13:32 **[ТС]**

Короче я перепутал div и span. Работает у меня уже все, плюсик тебе, тот кто выше)

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
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
<html>
<head>
<meta charset = "UTF-8">
</head>
 
<body>
<span id="Qwestion">?</span>
 
<div> 
    <input type="text" id="answer" />
    <input type="button" value="Ответ"  onclick="check()" />
</div>
 
<hr />
Статистика текущего теста: <br /> 
<div id="currentStats">
 
</div>
 
<hr/>
Результаты: <br /> 
<div id="records">
</div>
 
 
 
<script type="text/javascript">
    var spanEl = document.getElementById("test");
    var answerEl = document.getElementById("answer");
 
 
    var maxNumber = 10;
    var maxSteps = 10;
var opSign = ["+", "-", "*"];
var opBonus = [1, 2, 3];
 
var results = [];
var players = [];
 
var currentResults = [];
var gameScore = 0;
var stepNum = 0;
 
var number1;
var number2;
var operation;
var questionStr;
 
function setup() {
    var maxS = parseInt(prompt("Введите макс число вопросов"));
    var maxN = parseInt(prompt("Введите ограничение по числу"));
 
    if (!isNaN(maxS)) {
        maxSteps = maxS;
    }
 
    if (!isNaN(maxN)) {
        maxNumber = maxN;
    }  
}
 
 
function start() {
 
    nextStep();
 
    
}
 
function check()   //1 функция
{
    var answer = answerEl.value;
    var correctAnswer;
 
    switch(operation){
        case 0: 
            correctAnswer = number1 + number2;
            break;
        case 1: 
            correctAnswer = number1 - number2;
            break;
        case 2: 
            correctAnswer = number1 * number2;
            break;
    }
 
    if (correctAnswer == answer) {
        gameScore += opBonus[operation];
 
        questionStr += answer + "   Правильно!    +" + opBonus[operation] + "бал(а)";
    } else {
        questionStr += answer + "   HE Правильно!   (" + correctAnswer + ")";
    }
 
    currentResults.push(questionStr);
 
    displayCurrentStats();
 
    if (stepNum < maxSteps) {
        nextStep();
    } else {
        gameOver();
    }
}
 
function nextStep()  //2я функция
{
    stepNum++;
 
    number1 = Math.round(maxNumber * Math.random());
    number2 = Math.round(maxNumber * Math.random());
    operation = Math.round(2 * Math.random());
 
    questionStr = number1 + " " + opSign[operation] + " " + number2 + " = ";
    
    Qwestion.innerHTML = questionStr;
    answer.value = "";
}
 
function gameOver()  //3я функция
{
    results.push(gameScore);
 
    players.push(prompt("Ваше имя?"));
 
    currentResults = [];
    gameScore = 0;
    stepNum = 0;
 
    displayCurrentStats();
 
    displayResults();
 
    nextStep();
}
 
function displayCurrentStats()        //4я функция
{
    var divEl = document.getElementById("currentStats");
 
    var html = "<ol>";
    for (var i = 0; i < currentResults.length; i++) {
        html += "<li>" + currentResults[i] + "</li>";
    }
 
    html += "</ol>";
 
    divEl.innerHTML = html;
}
 
function sortNumber(a, b) {
    return a - b;
}
 
function displayResults() {
 
    results.sort(sortNumber);
 
    var divEl = document.getElementById("records");
 
    var html = "<ol>";
    for (var i = 0; i < results.length; i++) {
        html += "<li>" + Math.round(results[i]) + " балов у " + players[i] + "</li>";
    }
 
    html += "</ol>";
 
    divEl.innerHTML = html;
}
 
 
setup();
start();
 
</script>
 
 
</body>
</html>

@Foxconn · 24.04.2016, 20:01

Здравствуйте. Что бы не создавать новую тему, задам вопрос здесь.
Есть массив данных, который храниться в текстовом файле на сервере. Данные отправляются на сервер через форму ввода на странице. Данные представляют собой типы int и тип времени вида хх:хх. Перед вводом новых значений я считываю в форму на страницу хранящиеся в тестовом файле данные :

JavaScript
1
document.getElementById('name_in').value = name

и при этом считанное из файла значение name автоматически вставляется в форму ввода name_in:

HTML5
1
<input type="number" value="" id="name_in">

А вот как сделать, что бы считанное из файла значение времени хх:хх автоматически вставлялось в форму ввода времени:

HTML5
1
<input type="time" value="" id="time_in">

Описанный выше вариант в этом случае не работает.

@Ozick · 24.04.2016, 20:14

Foxconn, глупо было не создавать новую тему, т.к. это совсем другой вопрос. Подробней про тип времени

@Foxconn · 24.04.2016, 20:19

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

Подробней про тип времени

В текстовом файле храниться запись вида 23:30. Мне нужно считать это значение и автоматически вставить его в форму вида input type="time"

@Ozick · 24.04.2016, 20:23

Foxconn, здесь также, как и во всех остальных(html умный - сам все расставит):

HTML5
1
2
3
4
5
6
7
8
<html>
<body>
  <input type="time" id="times"/>
</body>
<script>
  document.getElementById("times").value = "13:15";
</script>
</html>

@Foxconn · 24.04.2016, 20:34

Спасибо, понял, что проблема в том, что не то я "скармливаю" document.getElementById

Приведенный Вами пример действительно прекрасно работает. Буду разбираться дальше.

@Foxconn · 27.04.2016, 19:41

Продолжаю разбираться. Как уже отмечал, пример Ozick работает без вопросов:

JavaScript
1
document.getElementById("times").value = "13:15";

Однако, если я представляю значение времени не в виде конкретных чисел, а виде переменной, ничего не получается.

Более подробно. Получаю значения времени из сервера методом JSON:

JavaScript
1
2
3
4
5
var i = JSON.parse(data);
....................................
time_1_start = i[25] // 25 элемент - время
document.getElementById('ust_time_1_start').value = time_1_start // время автоматически в окно НЕ ВСТАВЛЯЕТСЯ
$("#time_1_start").text(i[25]) // а на страницу выводится без проблем в виде 13:15

Что я делаю не так?

@Ozick · 27.04.2016, 20:57

Foxconn, обрати внимание на вид содержимого переменной. Он обязательно должен быть в виде "часы:минуты:секунды", или просто "часы:минуты". Вот примерчики:

PHP/HTML
1
2
3
4
5
6
7
8
9
<html>
<body>
  <input type="time" id="times"/>
</body>
<script>
  var timeInText = "20:56:13";
  document.getElementById("times").value = timeInText;
</script>
</html>

Или же так:

PHP/HTML
1
2
3
4
5
6
7
8
9
10
<html>
<body>
  <input type="time" id="times"/>
</body>
<script>
  var hours = "15";
  var min = "13";
  document.getElementById("times").value = hours + ":" + min;
</script>
</html>

@Foxconn · 27.04.2016, 21:43

Ozick, спасибо за направление на "путь истинный"

Сделал следующим образом, все заработало:

JavaScript
1
2
3
4
time_1_start = i[25]
var hour_1_start = time_1_start.substr(0, 2);           
var min_1_start = time_1_start.substr(3, 2); 
document.getElementById('ust_time_1_start').value = hour_1_start + ":" + min_1_start

@Ozick · 27.04.2016, 22:44

Foxconn, всегда пожалуйста

Новые блоги и статьи Все статьи Все блоги /
SDL3 для Web (WebAssembly): Реализация движения на Box2D v3 - трение и коллизии с повёрнутыми стенами 8Observer8 20.02.2026 Содержание блога Box2D позволяет легко создать главного героя, который не проходит сквозь стены и перемещается с заданным трением о препятствия, которые можно располагать под углом, как верхнее. . .	Конвертировать закладки radiotray-ng в m3u-плейлист damix 19.02.2026 Это можно сделать скриптом для PowerShell. Использование . \СonvertRadiotrayToM3U. ps1 <path_to_bookmarks. json> Рядом с файлом bookmarks. json появится файл bookmarks. m3u с результатом. # Check if. . .	Семь CDC на одном интерфейсе: 5 U[S]ARTов, 1 CAN и 1 SSI Eddy_Em 18.02.2026 Постепенно допиливаю свою "многоинтерфейсную плату". Выглядит вот так: https:/ / www. cyberforum. ru/ blog_attachment. php?attachmentid=11617&stc=1&d=1771445347 Основана на STM32F303RBT6. На борту пять. . .	Камера Toupcam IUA500KMA Eddy_Em 12.02.2026 Т. к. у всяких "хикроботов" слишком уж мелкий пиксель, для подсмотра в ESPriF они вообще плохо годятся: уже 14 величину можно рассмотреть еле-еле лишь на экспозициях под 3 секунды (а то и больше),. . .
И ясному Солнцу zbw 12.02.2026 И ясному Солнцу, и светлой Луне. В мире покоя нет и люди не могут жить в тишине. А жить им немного лет.	«Знание-Сила» zbw 12.02.2026 «Знание-Сила» «Время-Деньги» «Деньги -Пуля»	SDL3 для Web (WebAssembly): Подключение Box2D v3, физика и отрисовка коллайдеров 8Observer8 12.02.2026 Содержание блога Box2D - это библиотека для 2D физики для анимаций и игр. С её помощью можно определять были ли коллизии между конкретными объектами и вызывать обработчики событий столкновения. . . .	SDL3 для Web (WebAssembly): Загрузка PNG с прозрачным фоном с помощью SDL_LoadPNG (без SDL3_image) 8Observer8 11.02.2026 Содержание блога Библиотека SDL3 содержит встроенные инструменты для базовой работы с изображениями - без использования библиотеки SDL3_image. Пошагово создадим проект для загрузки изображения. . .

@Ozick 20 / 14 / 13 Регистрация: 07.02.2016 Сообщений: 90
	24.04.2016, 20:14
	Foxconn, глупо было не создавать новую тему, т.к. это совсем другой вопрос. Подробней про тип времени 0

@Foxconn 0 / 0 / 0 Регистрация: 24.04.2016 Сообщений: 35
	24.04.2016, 20:34
	Спасибо, понял, что проблема в том, что не то я "скармливаю" document.getElementById Приведенный Вами пример действительно прекрасно работает. Буду разбираться дальше. 0

@Ozick 20 / 14 / 13 Регистрация: 07.02.2016 Сообщений: 90
	27.04.2016, 22:44
	Foxconn, всегда пожалуйста 0