Создать Тест JavaScript

@kokosic_n1 · Регистрация: 14.05.2019

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

Мне нужно сделать тест на сайт, содержащий JavaScript.

Помогите пожалуйста разобраться или сделать с нуля тест ( вопросы написала ниже) просто вопрос- правильный ответ, вывод результатов в уведомлении.

Пожалуйста, на вас вся надежда :с

1.Дать определение "Компьютер - это.."

а) устройство или система, способная выполнять заданную, чётко определённую, изменяемую последовательность операций.

б) множество элементов, находящихся в отношениях и связях друг с другом, которое образует определённую целостность.

в) элемент персонального компьютера, который защищает компоненты компьютера устройство хранения информации.

2. Главная микросхема компьютера - ?

а) Винчестер

б) Материнская плата

в) Видеокарта

3. Антивирус это..?

а) специализированная программа для обнаружения компьютерных вирусов

б) Вид вредоносного программного обеспечения, способного создавать копии самого себя и внедряться в код других программ

в) вредоносная программа, замаскированная под обычное приложение.

4. Как называется разъем для установки центрального процессора?

а) Чипсет

б) Порт

в) Сокет

г) Шина

5. Корпус персонального компьютера предназначен для:

а) Ускорения работы компьютера

б) Повышения надёжности компьютера

в) Защиты от механических повреждений внутренностей компьютера

г) Экономии компьютером электроэнергии

6. Какая память является самой быстрой в компьютере?

а) Оперативная память

б). Кэш-память

в). Регистровая память процессора

г) Жёсткие диски

7. Что не является характеристикой оперативной памяти?

а). Тайминги

б). Пропускная способность

в). Стоимость

г). Тип памяти

8. К первому поколению оптических дисков относятся:

а) Blu-Ray диски

б) CD диски

в). DVD диски

г). Голографические диски

9. Основным элементом монитора на основе электронно-лучевой трубки является:

а). Корпус

б). Кинескоп и электронная пушка

в). Люминофор

г). Блок питания

10. В каком виде принтера используется принцип печати чернильными каплями?

а). В матричном

б). В струйном

в). В термосублимационном

г). В лазерном

@server_net · 09.06.2019, 22:49

тест на чисто js??? или сохранять на сервере?

@kokosic_n1 · 09.06.2019, 22:50 **[ТС]**

server_net, у меня сайт в html странице , туда вставлю этот тест

@server_net · 09.06.2019, 22:52

kokosic_n1, ну как вы хотите видеть этот тест???
Считать сколько правильных ответов, сколько неправильных?
Или просто правильно не правильно?

@kokosic_n1 · 09.06.2019, 22:53 **[ТС]**

server_net, типа чтобы вот человек сделал тест и у него в уведомлении высветилось что верно ,что нет. Или просто в процентах сколько верно. И спасибо вам за отзыв, на вас вся надежда!!!

@server_net · 09.06.2019, 23:03

kokosic_n1, блин но это час работы, я думаю. у меня просто у самого очень важная работа на завтра

@kokosic_n1 · 09.06.2019, 23:05 **[ТС]**

server_net, Мне не прям на завтра нужно сделать, а вы можете приступить к работе например завтра после своих дел? пожалуйста, только не забудьте, важно :с

@server_net · 09.06.2019, 23:16

kokosic_n1, хорошо

@kokosic_n1 · 09.06.2019, 23:17 **[ТС]**

server_net, спасибо большое, буду ждать,если что, напомню

@kidASM · 10.06.2019, 03:19

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
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
<!DOCTYPE html>
<html lang="ru">
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
        <meta http-equiv="x-ua-compatible" content="ie=edge">
        <title>Test</title>
        <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.8.2/css/all.css">
        <link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.3.1/css/bootstrap.min.css" rel="stylesheet">
        <link href="https://cdnjs.cloudflare.com/ajax/libs/mdbootstrap/4.8.2/css/mdb.min.css" rel="stylesheet">
        <style>
            .container {
                margin-top: 20px;
                margin-bottom: 20px;
            }
        </style>
    </head>
    <body>
        <div class="container">
            <h1 class="text-center">TEST</h1>
            <form>
                <ol>
                    <li class="font-weight-bold p-3">
                        Дать определение &quot;Компьютер - это..&quot;
                        <div class="custom-control custom-radio font-weight-normal">
                            <input type="radio" class="custom-control-input" id="q11" name="a1" value="1">
                            <label class="custom-control-label" for="q11">устройство или система, способная выполнять заданную, чётко определённую, изменяемую последовательность операций.</label>
                        </div>
                        <div class="custom-control custom-radio font-weight-normal">
                            <input type="radio" class="custom-control-input" id="q12" name="a1" value="2">
                            <label class="custom-control-label" for="q12">множество элементов, находящихся в отношениях и связях друг с другом, которое образует определённую целостность.</label>
                        </div>
                        <div class="custom-control custom-radio font-weight-normal">
                            <input type="radio" class="custom-control-input" id="q13" name="a1" value="3">
                            <label class="custom-control-label" for="q13">элемент персонального компьютера, который защищает компоненты компьютера устройство хранения информации.</label>
                        </div>
                    </li>
                    <li class="font-weight-bold p-3">
                        Главная микросхема компьютера - ?
                        <div class="custom-control custom-radio font-weight-normal">
                            <input type="radio" class="custom-control-input" id="q21" name="a2" value="1">
                            <label class="custom-control-label" for="q21">Винчестер</label>
                        </div>
                        <div class="custom-control custom-radio font-weight-normal">
                            <input type="radio" class="custom-control-input" id="q22" name="a2" value="2">
                            <label class="custom-control-label" for="q22">Материнская плата</label>
                        </div>
                        <div class="custom-control custom-radio font-weight-normal">
                            <input type="radio" class="custom-control-input" id="q23" name="a2" value="3">
                            <label class="custom-control-label" for="q23">Видеокарта</label>
                        </div>
                    </li>
                    <li class="font-weight-bold p-3">
                        Антивирус это..?
                        <div class="custom-control custom-radio font-weight-normal">
                            <input type="radio" class="custom-control-input" id="q31" name="a3" value="1">
                            <label class="custom-control-label" for="q31">специализированная программа для обнаружения компьютерных вирусов</label>
                        </div>
                        <div class="custom-control custom-radio font-weight-normal">
                            <input type="radio" class="custom-control-input" id="q32" name="a3" value="2">
                            <label class="custom-control-label" for="q32">вид вредоносного программного обеспечения, способного создавать копии самого себя и внедряться в код других программ</label>
                        </div>
                        <div class="custom-control custom-radio font-weight-normal">
                            <input type="radio" class="custom-control-input" id="q33" name="a3" value="3">
                            <label class="custom-control-label" for="q33">вредоносная программа, замаскированная под обычное приложение</label>
                        </div>
                    </li>
                    <li class="font-weight-bold p-3">
                        Как называется разъем для установки центрального процессора?
                        <div class="custom-control custom-radio font-weight-normal">
                            <input type="radio" class="custom-control-input" id="q41" name="a4" value="1">
                            <label class="custom-control-label" for="q41">Чипсет</label>
                        </div>
                        <div class="custom-control custom-radio font-weight-normal">
                            <input type="radio" class="custom-control-input" id="q42" name="a4" value="2">
                            <label class="custom-control-label" for="q42">Порт</label>
                        </div>
                        <div class="custom-control custom-radio font-weight-normal">
                            <input type="radio" class="custom-control-input" id="q43" name="a4" value="3">
                            <label class="custom-control-label" for="q43">Сокет</label>
                        </div>
                        <div class="custom-control custom-radio font-weight-normal">
                            <input type="radio" class="custom-control-input" id="q44" name="a4" value="4">
                            <label class="custom-control-label" for="q44">Шина</label>
                        </div>
                    </li>
                    <li class="font-weight-bold p-3">
                        Корпус персонального компьютера предназначен для
                        <div class="custom-control custom-radio font-weight-normal">
                            <input type="radio" class="custom-control-input" id="q51" name="a5" value="1">
                            <label class="custom-control-label" for="q51">Ускорения работы компьютера</label>
                        </div>
                        <div class="custom-control custom-radio font-weight-normal">
                            <input type="radio" class="custom-control-input" id="q52" name="a5" value="2">
                            <label class="custom-control-label" for="q52">Повышения надёжности компьютера</label>
                        </div>
                        <div class="custom-control custom-radio font-weight-normal">
                            <input type="radio" class="custom-control-input" id="q53" name="a5" value="3">
                            <label class="custom-control-label" for="q53">Защиты от механических повреждений внутренностей компьютера</label>
                        </div>
                        <div class="custom-control custom-radio font-weight-normal">
                            <input type="radio" class="custom-control-input" id="q54" name="a5" value="4">
                            <label class="custom-control-label" for="q54">Экономии компьютером электроэнергии</label>
                        </div>
                    </li>
                    <li class="font-weight-bold p-3">
                        Какая память является самой быстрой в компьютере?
                        <div class="custom-control custom-radio font-weight-normal">
                            <input type="radio" class="custom-control-input" id="q61" name="a6" value="1">
                            <label class="custom-control-label" for="q61">Оперативная память</label>
                        </div>
                        <div class="custom-control custom-radio font-weight-normal">
                            <input type="radio" class="custom-control-input" id="q62" name="a6" value="2">
                            <label class="custom-control-label" for="q62">Кэш-память</label>
                        </div>
                        <div class="custom-control custom-radio font-weight-normal">
                            <input type="radio" class="custom-control-input" id="q63" name="a6" value="3">
                            <label class="custom-control-label" for="q63">Регистровая память процессора</label>
                        </div>
                        <div class="custom-control custom-radio font-weight-normal">
                            <input type="radio" class="custom-control-input" id="q64" name="a6" value="4">
                            <label class="custom-control-label" for="q64">Жёсткие диски</label>
                        </div>
                    </li>
                    <li class="font-weight-bold p-3">
                        Что не является характеристикой оперативной памяти?
                        <div class="custom-control custom-radio font-weight-normal">
                            <input type="radio" class="custom-control-input" id="q71" name="a7" value="1">
                            <label class="custom-control-label" for="q71">Тайминги</label>
                        </div>
                        <div class="custom-control custom-radio font-weight-normal">
                            <input type="radio" class="custom-control-input" id="q72" name="a7" value="2">
                            <label class="custom-control-label" for="q72">Пропускная способность</label>
                        </div>
                        <div class="custom-control custom-radio font-weight-normal">
                            <input type="radio" class="custom-control-input" id="q73" name="a7" value="3">
                            <label class="custom-control-label" for="q73">Стоимость</label>
                        </div>
                        <div class="custom-control custom-radio font-weight-normal">
                            <input type="radio" class="custom-control-input" id="q74" name="a7" value="4">
                            <label class="custom-control-label" for="q74">Тип памяти</label>
                        </div>
                    </li>
                    <li class="font-weight-bold p-3">
                        К первому поколению оптических дисков относятся
                        <div class="custom-control custom-radio font-weight-normal">
                            <input type="radio" class="custom-control-input" id="q81" name="a8" value="1">
                            <label class="custom-control-label" for="q81">Blu-Ray диски</label>
                        </div>
                        <div class="custom-control custom-radio font-weight-normal">
                            <input type="radio" class="custom-control-input" id="q82" name="a8" value="2">
                            <label class="custom-control-label" for="q82">CD диски</label>
                        </div>
                        <div class="custom-control custom-radio font-weight-normal">
                            <input type="radio" class="custom-control-input" id="q83" name="a8" value="3">
                            <label class="custom-control-label" for="q83">DVD диски</label>
                        </div>
                        <div class="custom-control custom-radio font-weight-normal">
                            <input type="radio" class="custom-control-input" id="q84" name="a8" value="4">
                            <label class="custom-control-label" for="q84">Голографические диски</label>
                        </div>
                    </li>
                    <li class="font-weight-bold p-3">
                        Основным элементом монитора на основе электронно-лучевой трубки является
                        <div class="custom-control custom-radio font-weight-normal">
                            <input type="radio" class="custom-control-input" id="q91" name="a9" value="1">
                            <label class="custom-control-label" for="q91">Корпус</label>
                        </div>
                        <div class="custom-control custom-radio font-weight-normal">
                            <input type="radio" class="custom-control-input" id="q92" name="a9" value="2">
                            <label class="custom-control-label" for="q92">Кинескоп и электронная пушка</label>
                        </div>
                        <div class="custom-control custom-radio font-weight-normal">
                            <input type="radio" class="custom-control-input" id="q93" name="a9" value="3">
                            <label class="custom-control-label" for="q93">Люминофор</label>
                        </div>
                        <div class="custom-control custom-radio font-weight-normal">
                            <input type="radio" class="custom-control-input" id="q94" name="a9" value="4">
                            <label class="custom-control-label" for="q94">Блок питания</label>
                        </div>
                    </li>
                    <li class="font-weight-bold p-3">
                        В каком виде принтера используется принцип печати чернильными каплями?
                        <div class="custom-control custom-radio font-weight-normal">
                            <input type="radio" class="custom-control-input" id="q101" name="a10" value="1">
                            <label class="custom-control-label" for="q101">В матричном</label>
                        </div>
                        <div class="custom-control custom-radio font-weight-normal">
                            <input type="radio" class="custom-control-input" id="q102" name="a10" value="2">
                            <label class="custom-control-label" for="q102">В струйном</label>
                        </div>
                        <div class="custom-control custom-radio font-weight-normal">
                            <input type="radio" class="custom-control-input" id="q103" name="a10" value="3">
                            <label class="custom-control-label" for="q103">В термосублимационном</label>
                        </div>
                        <div class="custom-control custom-radio font-weight-normal">
                            <input type="radio" class="custom-control-input" id="q104" name="a10" value="4">
                            <label class="custom-control-label" for="q104">В лазерном</label>
                        </div>
                    </li>
                </ol>
                <div class="">
                    <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#basicExampleModal" id="btnCheck">Проверить</button>
                </div>
            </form>
        </div>
        <div class="modal fade" id="basicExampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
            <div class="modal-dialog" role="document">
                <div class="modal-content">
                    <div class="modal-header">
                        <h5 class="modal-title" id="exampleModalLabel">Результат</h5>
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                            <span aria-hidden="true">&times;</span>
                        </button>
                    </div>
                    <div class="modal-body text-center" id="modalTextBody"></div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
                    </div>
                </div>
            </div>
        </div>
        <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
        <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.4/umd/popper.min.js"></script>
        <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.3.1/js/bootstrap.min.js"></script>
        <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/mdbootstrap/4.8.2/js/mdb.min.js"></script>
        <script>
            var answers  = [1, 2, 1, 3, 3, 3, 3, 2, 2, 2];
            var answered = [0, 0, 0, 0, 0, 0, 0, 0, 0, 0];
            var form = document.forms[0];
            if(form){
                form.addEventListener('change', function(event){
                    answered[parseInt(event.target.name.replace('a',''))-1]=parseInt(event.target.value);
                });
            }
 
            var btnCheck = document.getElementById('btnCheck');
            if(btnCheck){
                btnCheck.addEventListener('click', function(event){
                    var counter = 0;
                    for(var i=0; i<answers.length; i++){
                        if(answered[i] === answers[i]){
                            counter++;
                        }
                    }
                    document.getElementById('modalTextBody').innerHTML = (counter*100/answers.length)+'% правильных ответов';
                });
            }
        </script>
    </body>
</html>

@kokosic_n1 · 10.06.2019, 08:56 **[ТС]**

Спасибо за код, скажите,как решить эту проблему, чтобы варианты ответов были ровненькими и текст в подвале не слезал вниз?

@kokosic_n1 · 10.06.2019, 09:03 **[ТС]**

kidASM, и вот у меня на сайте было меню верхнее белым шрифтом, вставила текст теста явы в контент стало меню синим цветом шрифта и слез подвал чуть-чуть не видно текста в подвале. Как быть? На скрине как стало и как было, текст в подвале не видно,как видите :с помогите, пожалуйста

@kidASM · 10.06.2019, 12:24

Вот как тест выглядит у меня Видео.
Вам нужно вставить эти ссылка

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

выше/над Ваших CSS.

@kokosic_n1 · 10.06.2019, 16:57 **[ТС]**

kidASM, спасибо, но у меня не вышло( Но я решила вывести на отдельную страницу тест, Все хорошо, надеюсь, что пойдет :с

Добавлено через 45 секунд
kidASM, Кстати, вы знаете как сделать простую кнопку быстрой прокрутки вверх на сайте html имеющую явускрипт?

@server_net · 10.06.2019, 17:02

kokosic_n1, так вам нужна моя помощь в создании или вы уже решили?

@kokosic_n1 · 10.06.2019, 17:04 **[ТС]**

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

Добавлено через 1 минуту
server_net, вот посмотрите на 12 сообщение здесь, в этом проблема, может вы знаете в чем проблема и как исправить?

@server_net · 10.06.2019, 17:06

стили не установлены, вам нужно установить стили для ваших элементов, отправьте полностью ваши скрипты пока у меня есть время я быстро исправлю

@kidASM · 10.06.2019, 21:05

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

Кстати, вы знаете как сделать простую кнопку быстрой прокрутки вверх на сайте html имеющую явускрипт?

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
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
<!DOCTYPE html>
<html lang="ru">
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
        <meta http-equiv="x-ua-compatible" content="ie=edge">
        <title>Test</title>
        <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.8.2/css/all.css">
        <link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.3.1/css/bootstrap.min.css" rel="stylesheet">
        <link href="https://cdnjs.cloudflare.com/ajax/libs/mdbootstrap/4.8.2/css/mdb.min.css" rel="stylesheet">
        <style>
            .container {
                margin-top: 20px;
                margin-bottom: 20px;
            }
            .toTop {
                display: block;
                position: fixed;
                bottom: 10px;
                right: 20px;
                background-color: #48f442;
                color: #ffffff;
                padding: 7px 15px;
                border-radius: 2px;
                box-shadow: 0 2px 5px 0 rgba(0,0,0,.16),0 2px 10px 0 rgba(0,0,0,.12);
                cursor: pointer;
            }
        </style>
    </head>
    <body>
        <div class="container">
            <h1 class="text-center">TEST</h1>
            <form>
                <ol>
                    <li class="font-weight-bold p-3">
                        Дать определение &quot;Компьютер - это..&quot;
                        <div class="custom-control custom-radio font-weight-normal">
                            <input type="radio" class="custom-control-input" id="q11" name="a1" value="1">
                            <label class="custom-control-label" for="q11">устройство или система, способная выполнять заданную, чётко определённую, изменяемую последовательность операций.</label>
                        </div>
                        <div class="custom-control custom-radio font-weight-normal">
                            <input type="radio" class="custom-control-input" id="q12" name="a1" value="2">
                            <label class="custom-control-label" for="q12">множество элементов, находящихся в отношениях и связях друг с другом, которое образует определённую целостность.</label>
                        </div>
                        <div class="custom-control custom-radio font-weight-normal">
                            <input type="radio" class="custom-control-input" id="q13" name="a1" value="3">
                            <label class="custom-control-label" for="q13">элемент персонального компьютера, который защищает компоненты компьютера устройство хранения информации.</label>
                        </div>
                    </li>
                    <li class="font-weight-bold p-3">
                        Главная микросхема компьютера - ?
                        <div class="custom-control custom-radio font-weight-normal">
                            <input type="radio" class="custom-control-input" id="q21" name="a2" value="1">
                            <label class="custom-control-label" for="q21">Винчестер</label>
                        </div>
                        <div class="custom-control custom-radio font-weight-normal">
                            <input type="radio" class="custom-control-input" id="q22" name="a2" value="2">
                            <label class="custom-control-label" for="q22">Материнская плата</label>
                        </div>
                        <div class="custom-control custom-radio font-weight-normal">
                            <input type="radio" class="custom-control-input" id="q23" name="a2" value="3">
                            <label class="custom-control-label" for="q23">Видеокарта</label>
                        </div>
                    </li>
                    <li class="font-weight-bold p-3">
                        Антивирус это..?
                        <div class="custom-control custom-radio font-weight-normal">
                            <input type="radio" class="custom-control-input" id="q31" name="a3" value="1">
                            <label class="custom-control-label" for="q31">специализированная программа для обнаружения компьютерных вирусов</label>
                        </div>
                        <div class="custom-control custom-radio font-weight-normal">
                            <input type="radio" class="custom-control-input" id="q32" name="a3" value="2">
                            <label class="custom-control-label" for="q32">вид вредоносного программного обеспечения, способного создавать копии самого себя и внедряться в код других программ</label>
                        </div>
                        <div class="custom-control custom-radio font-weight-normal">
                            <input type="radio" class="custom-control-input" id="q33" name="a3" value="3">
                            <label class="custom-control-label" for="q33">вредоносная программа, замаскированная под обычное приложение</label>
                        </div>
                    </li>
                    <li class="font-weight-bold p-3">
                        Как называется разъем для установки центрального процессора?
                        <div class="custom-control custom-radio font-weight-normal">
                            <input type="radio" class="custom-control-input" id="q41" name="a4" value="1">
                            <label class="custom-control-label" for="q41">Чипсет</label>
                        </div>
                        <div class="custom-control custom-radio font-weight-normal">
                            <input type="radio" class="custom-control-input" id="q42" name="a4" value="2">
                            <label class="custom-control-label" for="q42">Порт</label>
                        </div>
                        <div class="custom-control custom-radio font-weight-normal">
                            <input type="radio" class="custom-control-input" id="q43" name="a4" value="3">
                            <label class="custom-control-label" for="q43">Сокет</label>
                        </div>
                        <div class="custom-control custom-radio font-weight-normal">
                            <input type="radio" class="custom-control-input" id="q44" name="a4" value="4">
                            <label class="custom-control-label" for="q44">Шина</label>
                        </div>
                    </li>
                    <li class="font-weight-bold p-3">
                        Корпус персонального компьютера предназначен для
                        <div class="custom-control custom-radio font-weight-normal">
                            <input type="radio" class="custom-control-input" id="q51" name="a5" value="1">
                            <label class="custom-control-label" for="q51">Ускорения работы компьютера</label>
                        </div>
                        <div class="custom-control custom-radio font-weight-normal">
                            <input type="radio" class="custom-control-input" id="q52" name="a5" value="2">
                            <label class="custom-control-label" for="q52">Повышения надёжности компьютера</label>
                        </div>
                        <div class="custom-control custom-radio font-weight-normal">
                            <input type="radio" class="custom-control-input" id="q53" name="a5" value="3">
                            <label class="custom-control-label" for="q53">Защиты от механических повреждений внутренностей компьютера</label>
                        </div>
                        <div class="custom-control custom-radio font-weight-normal">
                            <input type="radio" class="custom-control-input" id="q54" name="a5" value="4">
                            <label class="custom-control-label" for="q54">Экономии компьютером электроэнергии</label>
                        </div>
                    </li>
                    <li class="font-weight-bold p-3">
                        Какая память является самой быстрой в компьютере?
                        <div class="custom-control custom-radio font-weight-normal">
                            <input type="radio" class="custom-control-input" id="q61" name="a6" value="1">
                            <label class="custom-control-label" for="q61">Оперативная память</label>
                        </div>
                        <div class="custom-control custom-radio font-weight-normal">
                            <input type="radio" class="custom-control-input" id="q62" name="a6" value="2">
                            <label class="custom-control-label" for="q62">Кэш-память</label>
                        </div>
                        <div class="custom-control custom-radio font-weight-normal">
                            <input type="radio" class="custom-control-input" id="q63" name="a6" value="3">
                            <label class="custom-control-label" for="q63">Регистровая память процессора</label>
                        </div>
                        <div class="custom-control custom-radio font-weight-normal">
                            <input type="radio" class="custom-control-input" id="q64" name="a6" value="4">
                            <label class="custom-control-label" for="q64">Жёсткие диски</label>
                        </div>
                    </li>
                    <li class="font-weight-bold p-3">
                        Что не является характеристикой оперативной памяти?
                        <div class="custom-control custom-radio font-weight-normal">
                            <input type="radio" class="custom-control-input" id="q71" name="a7" value="1">
                            <label class="custom-control-label" for="q71">Тайминги</label>
                        </div>
                        <div class="custom-control custom-radio font-weight-normal">
                            <input type="radio" class="custom-control-input" id="q72" name="a7" value="2">
                            <label class="custom-control-label" for="q72">Пропускная способность</label>
                        </div>
                        <div class="custom-control custom-radio font-weight-normal">
                            <input type="radio" class="custom-control-input" id="q73" name="a7" value="3">
                            <label class="custom-control-label" for="q73">Стоимость</label>
                        </div>
                        <div class="custom-control custom-radio font-weight-normal">
                            <input type="radio" class="custom-control-input" id="q74" name="a7" value="4">
                            <label class="custom-control-label" for="q74">Тип памяти</label>
                        </div>
                    </li>
                    <li class="font-weight-bold p-3">
                        К первому поколению оптических дисков относятся
                        <div class="custom-control custom-radio font-weight-normal">
                            <input type="radio" class="custom-control-input" id="q81" name="a8" value="1">
                            <label class="custom-control-label" for="q81">Blu-Ray диски</label>
                        </div>
                        <div class="custom-control custom-radio font-weight-normal">
                            <input type="radio" class="custom-control-input" id="q82" name="a8" value="2">
                            <label class="custom-control-label" for="q82">CD диски</label>
                        </div>
                        <div class="custom-control custom-radio font-weight-normal">
                            <input type="radio" class="custom-control-input" id="q83" name="a8" value="3">
                            <label class="custom-control-label" for="q83">DVD диски</label>
                        </div>
                        <div class="custom-control custom-radio font-weight-normal">
                            <input type="radio" class="custom-control-input" id="q84" name="a8" value="4">
                            <label class="custom-control-label" for="q84">Голографические диски</label>
                        </div>
                    </li>
                    <li class="font-weight-bold p-3">
                        Основным элементом монитора на основе электронно-лучевой трубки является
                        <div class="custom-control custom-radio font-weight-normal">
                            <input type="radio" class="custom-control-input" id="q91" name="a9" value="1">
                            <label class="custom-control-label" for="q91">Корпус</label>
                        </div>
                        <div class="custom-control custom-radio font-weight-normal">
                            <input type="radio" class="custom-control-input" id="q92" name="a9" value="2">
                            <label class="custom-control-label" for="q92">Кинескоп и электронная пушка</label>
                        </div>
                        <div class="custom-control custom-radio font-weight-normal">
                            <input type="radio" class="custom-control-input" id="q93" name="a9" value="3">
                            <label class="custom-control-label" for="q93">Люминофор</label>
                        </div>
                        <div class="custom-control custom-radio font-weight-normal">
                            <input type="radio" class="custom-control-input" id="q94" name="a9" value="4">
                            <label class="custom-control-label" for="q94">Блок питания</label>
                        </div>
                    </li>
                    <li class="font-weight-bold p-3">
                        В каком виде принтера используется принцип печати чернильными каплями?
                        <div class="custom-control custom-radio font-weight-normal">
                            <input type="radio" class="custom-control-input" id="q101" name="a10" value="1">
                            <label class="custom-control-label" for="q101">В матричном</label>
                        </div>
                        <div class="custom-control custom-radio font-weight-normal">
                            <input type="radio" class="custom-control-input" id="q102" name="a10" value="2">
                            <label class="custom-control-label" for="q102">В струйном</label>
                        </div>
                        <div class="custom-control custom-radio font-weight-normal">
                            <input type="radio" class="custom-control-input" id="q103" name="a10" value="3">
                            <label class="custom-control-label" for="q103">В термосублимационном</label>
                        </div>
                        <div class="custom-control custom-radio font-weight-normal">
                            <input type="radio" class="custom-control-input" id="q104" name="a10" value="4">
                            <label class="custom-control-label" for="q104">В лазерном</label>
                        </div>
                    </li>
                </ol>
                <div class="">
                    <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#basicExampleModal" id="btnCheck">Проверить</button>
                </div>
            </form>
        </div>
        <div class="toTop" id="toTop">На верх</div>
        <div class="modal fade" id="basicExampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
            <div class="modal-dialog" role="document">
                <div class="modal-content">
                    <div class="modal-header">
                        <h5 class="modal-title" id="exampleModalLabel">Результат</h5>
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                            <span aria-hidden="true">&times;</span>
                        </button>
                    </div>
                    <div class="modal-body text-center" id="modalTextBody"></div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
                    </div>
                </div>
            </div>
        </div>
        <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
        <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.4/umd/popper.min.js"></script>
        <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.3.1/js/bootstrap.min.js"></script>
        <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/mdbootstrap/4.8.2/js/mdb.min.js"></script>
        <script>
            var answers  = [1, 2, 1, 3, 3, 3, 3, 2, 2, 2];
            var answered = [0, 0, 0, 0, 0, 0, 0, 0, 0, 0];
            var form = document.forms[0];
            if(form){
                form.addEventListener('change', function(event){
                    answered[parseInt(event.target.name.replace('a',''))-1]=parseInt(event.target.value);
                });
            }
 
            var btnCheck = document.getElementById('btnCheck');
            if(btnCheck){
                btnCheck.addEventListener('click', function(event){
                    var counter = 0;
                    for(var i=0; i<answers.length; i++){
                        if(answered[i] === answers[i]){
                            counter++;
                        }
                    }
                    document.getElementById('modalTextBody').innerHTML = (counter*100/answers.length)+'% правильных ответов';
                });
            }
            var btnToTop = document.getElementById('toTop');
            if(btnToTop){
                btnToTop.addEventListener('click', function(event){
                    window.scrollTo({top: 0, behavior: 'smooth'});
                });
            }
        </script>
    </body>
</html>

@kokosic_n1 · 10.06.2019, 21:29 **[ТС]**

kidASM, Скажите пожалуйста,а где строка подключения js кнопки в head ? А то я вставляю не прям текстом, а лишь кнопочку.

@kidASM · 10.06.2019, 22:39

Кнопка на странице

HTML5
1
<div class="toTop" id="toTop">На верх</div>

Внешний вид кнопки

CSS
1
2
3
4
5
6
7
8
9
10
11
12
.toTop {
    display: block;
    position: fixed;
    bottom: 10px;
    right: 20px;
    background-color: #48f442;
    color: #ffffff;
    padding: 7px 15px;
    border-radius: 2px;
    box-shadow: 0 2px 5px 0 rgba(0,0,0,.16),0 2px 10px 0 rgba(0,0,0,.12);
    cursor: pointer;
}

Поведение кнопки

JavaScript
1
2
3
4
5
6
var btnToTop = document.getElementById('toTop');
if(btnToTop){
    btnToTop.addEventListener('click', function(event){
        window.scrollTo({top: 0, behavior: 'smooth'});
    });
}

Новые блоги и статьи Все статьи Все блоги /
Философия технологии iceja 01.02.2026 На мой взгляд у человека в технических проектах остается роль генерального директора. Все остальное нейронки делают уже лучше человека. Они не могут нести предпринимательские риски, не могут. . .	SDL3 для Web (WebAssembly): Вывод текста со шрифтом TTF с помощью SDL3_ttf 8Observer8 01.02.2026 Содержание блога В этой пошаговой инструкции создадим с нуля веб-приложение, которое выводит текст в окне браузера. Запустим на Android на локальном сервере. Загрузим Release на бесплатный. . .	SDL3 для Web (WebAssembly): Сборка C/C++ проекта из консоли 8Observer8 30.01.2026 Содержание блога Если вы откроете примеры для начинающих на официальном репозитории SDL3 в папке: examples, то вы увидите, что все примеры используют следующие четыре обязательные функции, а. . .	SDL3 для Web (WebAssembly): Установка Emscripten SDK (emsdk) и CMake для сборки C и C++ приложений в Wasm 8Observer8 30.01.2026 Содержание блога Для того чтобы скачать Emscripten SDK (emsdk) необходимо сначало скачать и уставить Git: Install for Windows. Следуйте стандартной процедуре установки Git через установщик. . . .
SDL3 для Android: Подключение Box2D v3, физика и отрисовка коллайдеров 8Observer8 29.01.2026 Содержание блога Box2D - это библиотека для 2D физики для анимаций и игр. С её помощью можно определять были ли коллизии между конкретными объектами. Версия v3 была полностью переписана на Си, в. . .	Инструменты COM: Сохранение данный из VARIANT в файл и загрузка из файла в VARIANT bedvit 28.01.2026 Сохранение базовых типов COM и массивов (одномерных или двухмерных) любой вложенности (деревья) в файл, с возможностью выбора алгоритмов сжатия и шифрования. Часть библиотеки BedvitCOM Использованы. . .	SDL3 для Android: Загрузка PNG с альфа-каналом с помощью SDL_LoadPNG (без SDL3_image) 8Observer8 28.01.2026 Содержание блога SDL3 имеет собственные средства для загрузки и отображения PNG-файлов с альфа-каналом и базовой работы с ними. В этой инструкции используется функция SDL_LoadPNG(), которая. . .	SDL3 для Android: Загрузка PNG с альфа-каналом с помощью SDL3_image 8Observer8 27.01.2026 Содержание блога SDL3_image - это библиотека для загрузки и работы с изображениями. Эта пошаговая инструкция покажет, как загрузить и вывести на экран смартфона картинку с альфа-каналом, то есть с. . .

Создать Тест JavaScript

Решение

Решение

Решение

@kokosic_n1 2 / 2 / 1 Регистрация: 14.05.2019 Сообщений: 135

	Создать Тест JavaScript 09.06.2019, 17:36. Показов 4896. Ответов 20 Метки html 5, javascript для начинающих, javascript (Все метки) Мне нужно сделать тест на сайт, содержащий JavaScript. Помогите пожалуйста разобраться или сделать с нуля тест ( вопросы написала ниже) просто вопрос- правильный ответ, вывод результатов в уведомлении. Пожалуйста, на вас вся надежда :с 1.Дать определение "Компьютер - это.." а) устройство или система, способная выполнять заданную, чётко определённую, изменяемую последовательность операций. б) множество элементов, находящихся в отношениях и связях друг с другом, которое образует определённую целостность. в) элемент персонального компьютера, который защищает компоненты компьютера устройство хранения информации. 2. Главная микросхема компьютера - ? а) Винчестер б) Материнская плата в) Видеокарта 3. Антивирус это..? а) специализированная программа для обнаружения компьютерных вирусов б) Вид вредоносного программного обеспечения, способного создавать копии самого себя и внедряться в код других программ в) вредоносная программа, замаскированная под обычное приложение. 4. Как называется разъем для установки центрального процессора? а) Чипсет б) Порт в) Сокет г) Шина 5. Корпус персонального компьютера предназначен для: а) Ускорения работы компьютера б) Повышения надёжности компьютера в) Защиты от механических повреждений внутренностей компьютера г) Экономии компьютером электроэнергии 6. Какая память является самой быстрой в компьютере? а) Оперативная память б). Кэш-память в). Регистровая память процессора г) Жёсткие диски 7. Что не является характеристикой оперативной памяти? а). Тайминги б). Пропускная способность в). Стоимость г). Тип памяти 8. К первому поколению оптических дисков относятся: а) Blu-Ray диски б) CD диски в). DVD диски г). Голографические диски 9. Основным элементом монитора на основе электронно-лучевой трубки является: а). Корпус б). Кинескоп и электронная пушка в). Люминофор г). Блок питания 10. В каком виде принтера используется принцип печати чернильными каплями? а). В матричном б). В струйном в). В термосублимационном г). В лазерном 0

@server_net 68 / 60 / 10 Регистрация: 07.03.2019 Сообщений: 657
	09.06.2019, 22:49
	тест на чисто js??? или сохранять на сервере? 0

@kokosic_n1 2 / 2 / 1 Регистрация: 14.05.2019 Сообщений: 135
	09.06.2019, 22:50 [ТС]
	server_net, у меня сайт в html странице , туда вставлю этот тест 0

@server_net 68 / 60 / 10 Регистрация: 07.03.2019 Сообщений: 657
	09.06.2019, 22:52
	kokosic_n1, ну как вы хотите видеть этот тест??? Считать сколько правильных ответов, сколько неправильных? Или просто правильно не правильно? 0

@kokosic_n1 2 / 2 / 1 Регистрация: 14.05.2019 Сообщений: 135
	09.06.2019, 22:53 [ТС]
	server_net, типа чтобы вот человек сделал тест и у него в уведомлении высветилось что верно ,что нет. Или просто в процентах сколько верно. И спасибо вам за отзыв, на вас вся надежда!!! 0

@server_net 68 / 60 / 10 Регистрация: 07.03.2019 Сообщений: 657
	09.06.2019, 23:03
	kokosic_n1, блин но это час работы, я думаю. у меня просто у самого очень важная работа на завтра 0

@kokosic_n1 2 / 2 / 1 Регистрация: 14.05.2019 Сообщений: 135
	09.06.2019, 23:05 [ТС]
	server_net, Мне не прям на завтра нужно сделать, а вы можете приступить к работе например завтра после своих дел? пожалуйста, только не забудьте, важно :с 0

@server_net 68 / 60 / 10 Регистрация: 07.03.2019 Сообщений: 657
	09.06.2019, 23:16
	kokosic_n1, хорошо 0

@kokosic_n1 2 / 2 / 1 Регистрация: 14.05.2019 Сообщений: 135
	09.06.2019, 23:17 [ТС]
	server_net, спасибо большое, буду ждать,если что, напомню 0

@kokosic_n1 2 / 2 / 1 Регистрация: 14.05.2019 Сообщений: 135
	10.06.2019, 08:56 [ТС]
	Спасибо за код, скажите,как решить эту проблему, чтобы варианты ответов были ровненькими и текст в подвале не слезал вниз? Миниатюры 0

@kokosic_n1 2 / 2 / 1 Регистрация: 14.05.2019 Сообщений: 135
	10.06.2019, 09:03 [ТС]
	kidASM, и вот у меня на сайте было меню верхнее белым шрифтом, вставила текст теста явы в контент стало меню синим цветом шрифта и слез подвал чуть-чуть не видно текста в подвале. Как быть? На скрине как стало и как было, текст в подвале не видно,как видите :с помогите, пожалуйста Миниатюры 0

@kokosic_n1 2 / 2 / 1 Регистрация: 14.05.2019 Сообщений: 135
	10.06.2019, 16:57 [ТС]
	kidASM, спасибо, но у меня не вышло( Но я решила вывести на отдельную страницу тест, Все хорошо, надеюсь, что пойдет :с Добавлено через 45 секунд kidASM, Кстати, вы знаете как сделать простую кнопку быстрой прокрутки вверх на сайте html имеющую явускрипт? 0

@server_net 68 / 60 / 10 Регистрация: 07.03.2019 Сообщений: 657
	10.06.2019, 17:02
	kokosic_n1, так вам нужна моя помощь в создании или вы уже решили? 0

@kokosic_n1 2 / 2 / 1 Регистрация: 14.05.2019 Сообщений: 135
	10.06.2019, 17:04 [ТС]
	server_net, здравствуйте, если вы знаете как мне помочь, то да, нужна Добавлено через 1 минуту server_net, вот посмотрите на 12 сообщение здесь, в этом проблема, может вы знаете в чем проблема и как исправить? 0

@server_net 68 / 60 / 10 Регистрация: 07.03.2019 Сообщений: 657
	10.06.2019, 17:06
	стили не установлены, вам нужно установить стили для ваших элементов, отправьте полностью ваши скрипты пока у меня есть время я быстро исправлю 1

@kokosic_n1 2 / 2 / 1 Регистрация: 14.05.2019 Сообщений: 135
	10.06.2019, 21:29 [ТС]
	kidASM, Скажите пожалуйста,а где строка подключения js кнопки в head ? А то я вставляю не прям текстом, а лишь кнопочку. 0