«Показать» ответ на кнопке нажмите ⇐ Html

[Anonymous]

Я создаю викторину для своей веб -страницы. У меня есть функция, работая над первым вопросом. Где кнопка скажет «Показать решение». После нажатия он покажет элемент. В настоящее время кнопка не изменяет текст кнопки, чтобы «скрыть решение» после того, как она отображается. И когда я нажимаю на решение «Показать решение», он покажет первый вопрос. Я знаю, что функция связана с этой функцией, но я не хочу копировать функцию несколько раз и менять идентификаторы на ответ1, ответ2 и т. Д. < /p>

Код: Выделить всё

function show_hide() {
var myAnswer = document.getElementById('answer');

var displaySetting = myAnswer.style.display;

var quizButton = document.getElementsByClassName('quiz-button');

if (displaySetting == "inline-block") {
myAnswer.style.display = 'none';

quizButton.innerHTML = 'Show Answer';
} else {
myAnswer.style.display = 'inline-block';
quizButton.innerHTML = 'Hide Answer';
}
}< /code>
.quiz-question {
margin-bottom: 10px;
text-align: left;
font-size: 15px;
color: #f44336;
font-weight: 400;
}

.quiz-button {
display: inline-block;
text-decoration: none;
color: #111;
border: 1px solid #f44336;
padding: 5px 5px;
font-size: 13px;
background: transparent;
position: relative;
cursor: pointer;
}

.quiz-button:hover {
color: #fff;
background: #f44336;
transition: 0.5s;
}

#answer {
display: none;
}< /code>

Chapter 1.1 End of Topic Quiz

The following quiz is meant to reinforce your understanding of the material presented above.


[h4]1. What is a statement? [/h4]
Show Solution

A statement[/b] is an instruction in a computer program that tells the computer to perform an action.[b]





[h4]2. What is a function? [/h4]
Show Solution

A function[/b] is several statements that are executed sequentially.

Подробнее здесь: https://stackoverflow.com/questions/709 ... tton-press