Функция при нажатии срабатывает один раз и больше не работает
Всем привет. Возникла следующая проблема:
Нажимая на кнопку функция снизу должна переключаться с вопроса на вопрос. Срабатывает всего один раз.
this.nextQuestButton.onclick = function() {
this.getQuestions = document.querySelectorAll(".question");
for (i = 1; i < this.getQuestions.length; i++) {
this.getQuestions[i].style.display="block";
var prevQuest = this.getQuestions[i - 1];
prevQuest.style.display="none";
return getQuestions[i];
}
}
В чем проблема то, не пойму? <div class="questions"> <div class="question question_one" style="display: none">Как дела?</div> <div class="question question_two" style="display: none">Сколько лет?</div> <div class="question question_three" style="display: none">Скучаешь?</div> <div class="question question_four" style="display: none">Гул го?</div> </div> <a href="#" class="button next_quest" style="display: none">Следующий вопрос</a> |
notOldFagFromRussia,
а цикл зачем? |
notOldFagFromRussia,
<!DOCTYPE html>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<style type="text/css">
</style>
<script>
window.addEventListener('DOMContentLoaded', function() {
var arr = ["Как дела?","Сколько лет?","Скучаешь?","Гул го?"];
var node = document.querySelector('.slider'),
btn = document.querySelector('.btn');
btn.addEventListener('click', function() {
node.innerHTML = arr.length ? arr.shift() : "ваш результат";
});
});
</script>
</head>
<body>
<div class="slider">чтобы пройти тест нажмите кнопку ниже</div>
<input class="btn" type="button" value="next">
</body>
</html>
|
notOldFagFromRussia,
<!DOCTYPE html>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<style type="text/css">
.question{
display: none;
}
.question.show{
display: block;
}
</style>
<script>
window.addEventListener('DOMContentLoaded', function() {
var getQuestions = document.querySelectorAll(".question"),
i = 0,
len = getQuestions.length - 1
nextQuestButton = document.querySelector('.next_quest');
nextQuestButton.addEventListener('click', function(event) {
event.preventDefault();
if(i < len) {
getQuestions[i++].classList.remove("show");
getQuestions[i].classList.add("show");
}
});
});
</script>
</head>
<body>
<div class="questions">
<div class="question question_one show" >Как дела?</div>
<div class="question question_two" >Сколько лет?</div>
<div class="question question_three" >Скучаешь?</div>
<div class="question question_four" >Гул го?</div>
</div>
<a href="#" class="button next_quest" >Следующий вопрос</a>
</body>
</html>
|
| Часовой пояс GMT +3, время: 15:47. |