Member 13224874 Ответов: 2

Помощь с кодированием кнопки on click


Привет, я очень новичок в программировании... Я хочу, чтобы ответ на вопрос показывался только после того, как человек нажмет на кнопку. В данный момент ответ отображается при загрузке страницы, если вы нажмете кнопку Показать ответ, он скроет ответ, и нажмите еще раз, чтобы показать ответ, но я хочу, чтобы он начинался с того, что не показывал ответ (чтобы не выдавать его). Вся помощь приветствуется.

Что я уже пробовал:

Кнопки.кнопка {
дисплей: блок;
маржа-слева: авто;
поле справа: авто;
выровнять: по центру }
#myDIV {
ширина: 100%;
заполнение: 50px 0;
выравнивание текста: по центру;
цвет фона: #65a83d;
маржа-топ:20px;
}

&л;класс button="кнопка" функция onclick="myfunction () С"и GT;показывают, ответ &ЛТ; кнопка/&ГТ;
< div>
&ЛТ;див с ID="myDIV" класс="скрытый"и GT;
Ответ-10.
< / div>

& lt;скрипт>
функция myFunction() {
var x = document. getElementById('myDIV');
если (Х.стиль.дисплей === 'нет') {
х.стиль.блок отображения ='';
} еще {
x. style. display = 'none';
}
}
< / script>

2 Ответов

Рейтинг:
17

ZurdoDev

Если вы посмотрите на то, что делает код, чтобы показать его, он устанавливает стиль на div. Итак, просто сделайте это с вашим div:

<div id="myDIV" class="hidden" style="display: none;">

и это начнет его скрывать.


Рейтинг:
1

jgakenhe

Во-первых, у вас нет CSS-класса для "скрытого", поэтому он ничего не будет делать. Чтобы написать наименьшее количество кода для удовлетворения ваших потребностей, вам нужно вызвать JavaScript MyFunction() либо в теле, либо в окне onload(). Я решил сделать это в теле.

Все, что я добавил, Было < body onload="myFunction()"> к тегу html body ниже.

Ниже приведен пример веб-страницы для его тестирования.

<!Элемент DOCTYPE в HTML общественности "-//W3C для//определения DTD HTML 4.0 с переходным//ванной"&ГТ;
< html>
< голова>
в <название&ГТ;впрыска&ЛТ;/название&ГТ;
< style type= "text/css">
Кнопки.кнопка {
дисплей: блок;
маржа-слева: авто;
поле справа: авто;
выровнять: по центру }
#myDIV {
ширина: 100%;
заполнение: 50px 0;
выравнивание текста: по центру;
цвет фона: #65a83d;
маржа-топ:20px;
}
< / стиль>
< / head>
& lt;body onload= "myFunction ()" >
&л;класс button="кнопка" функция onclick="myfunction () С"и GT;показывают, ответ &ЛТ; кнопка/&ГТ;
< div>
<div id=" myDIV "style= "hidden">
Ответ-10.
< / div>

& lt;скрипт>
функция myFunction() {
var x = document. getElementById('myDIV');
если (Х.стиль.дисплей === 'нет') {
х.стиль.блок отображения ='';
} еще {
x. style. display = 'none';
}
}
< / script>
< / body>
< / html>