小编sol*_*l_s的帖子

循环遍历 <divs> 数组,每次使用 javascript 只显示一个

我正在使用 javascript 和 html 制作一个小测验应用程序。测验的设置使用户只能在页面上看到一个问题。当他们按下上一个和下一个按钮时,它分别向用户显示上一个和下一个问题。

我想要做的是,遍历由 getElementByClassName 返回的元素数组,并在用户每次按下“下一步”按钮时显示下一个项目。我目前遇到的问题是,当按下“下一步”按钮时,第一个元素之后的每个元素都显示在页面上。页面上还有一个“上一个”按钮,向用户显示前一个元素,但是它删除了数组中的第一个元素,显示“无法设置未定义的属性‘显示’”错误和 div 的其余部分元素仍然显示在页面上。

这是当前的代码 HTML:

const nextBtn = document.getElementById('next');
const prevBtn = document.getElementById('prev');
const quizes = document.getElementsByClassName('quiz');
//show and hide divs when user presses next
nextBtn.addEventListener('click', function() {
  for (i = 0; i < quizes.length; i++) {
    quizes[i].style.display = "block";
  }
})

prevBtn.addEventListener('click', function() {
  if (quizes.length > 1) {
    for (i = 0; quizes.length > 1; i--) {
      if (quizes[i].display = "block") {
        quizes[i].style.display = "none";
      }
    }
  } else {
    alert('no …
Run Code Online (Sandbox Code Playgroud)

html javascript

2
推荐指数
1
解决办法
222
查看次数

标签 统计

html ×1

javascript ×1