我的证明幻灯片会在一段时间后复制文本，但我不知道如何调试它，有人可以帮我吗？

编程问答 2022-07-30

问题描述

我在调试代码时遇到了麻烦，我的JavaScript知识也太有限，无法弄清楚这一点，因此，如果有人愿意帮助我，将不胜感激。

这是我堂兄帮助我建立的推荐滑块，问题是过了一会儿，它会在一段时间后复制文本，并且您会得到无数的相同文本列表。首先，我认为它与时间间隔有关，但我尝试对其进行更改并进行了一段时间的尝试，但是它并没有解决任何问题。

此外，我的HTML中没有文本，而是在数组中，并且文本的HTML是用JavaScript创建的，也许这只是一开始的不好方法？因为我在互联网上找不到这样的人。我这样做的原因是，我希望有一种简便的方法来向推荐书中添加其他文本，而不必编写更多的HTML。

谢谢您的帮助。

let time = 15000;
const testimonials = [
  {
    text: 'Liane ist eine kompetente und sehr freundliche Kosmetikerin,die wirklich was von ihrem Handwerk versteht. Ich habe mich bei ihr sehr wohl und gut aufgehoben gefühlt. Nach der Kombibehandlung mit Microdermabrasion und der Schallwellenbehandlung fühlt sich meine Haut klasse an und man fühlt sich wie neu geboren. Vielen lieben Dank dafür.',name: 'Anna Vetter'
  },{
    text: 'Ich bin wirklich sehr zufrieden. Sehr kompetent,freundlich und das Ergebnis ist wie Erwartet. Immer wieder gerne,nur zu Empfehlen. ?',name: 'Janine Schmidt'
  },{
    text: 'Ich habe schon nach der ersten Behandlung einen sichtbaren Effekt wahrgenommen! Komme gerne wieder zu weiteren Behandlungen und würde PureSkin auch all meinen Freundinnen weiterempfehlen! ?',name: 'Merle Mauritz'
  },{
    text: 'Danke für die tolle Behandlung mit Slimyonik! Tolles Ergebnis schon nach der ersten Behandlung! Freue mich auf die weiteren!',name: 'Karo Pity'
  },{
    text: ' Als ich zu Pureskin kam,erhielt ich zunächst eine ausgiebige Beratung von Liane. Sie empfahl mir das „Mikroneedling“. Bereits nach zwei Sitzungen stellte ich wesentliche,sichtbare Veränderungen meiner Haut fest! Und diese halten bis heute immer noch an. Lianes freundliche Art und Weise,die kompetente Beratung und das echt schöne Studio,haben mich auf jeden Fall überzeugt,und ich kann es euch nur weiterempfehlen.',name: 'Saniya Ar'
  }
];
let i = 0;

const createHTML = () => {
  let div = document.createElement('div');
  let {text,name} = testimonials[i];
  div.className = 'slide-content';
  div.setAttribute('style','opacity: 1; transform: translateX(0)');
  div.innerHTML = `
    <p class='testimonial'>
      ${text}
    </p>
    <div class="user-details">
    <h4 class="username">
      ${name}
    </h4>
    </div>
  `;
  document.querySelector('.slide-entry').appendChild(div);
}

const updateTestimonials = () => {
  let {text,name} = testimonials[i];
  if (!document.querySelector('.slide-content')) {
  createHTML();
  const dotContainer = document.createElement('div');
  dotContainer.className = 'dot-container';
  for(let j = 0; j < testimonials.length; j++) {
    const dot = document.createElement('span');
    j === 0 ? dot.className = 'dot selected' : dot.className = 'dot';
    dotContainer.appendChild(dot);
  }
  document.querySelector('.slideshow').appendChild(dotContainer);
  } else {
  let x = document.querySelectorAll('.slide-content');
  anime({
        targets: x,translateX: -250,duration: 6000,opacity: 0,easing: 'easeInOutQuad',complete: function(){
          x[0].remove();
          createHTML();
          let y = document.querySelectorAll('.slide-content');
          let z = document.querySelectorAll('.dot');
          for(let k = 0; k < z.length; k++) {
            console.log(i);
            if(z[k].classList.contains('selected')) {
              z[k].classList.remove('selected');
            }
            if(k == i) {
              z[k].classList.add('selected');
            
          }
        }
          anime({
            targets: y,translateX: 0,duration: 1000,opacity: 1,complete: function() {
              i++;
              if(i == testimonials.length) {
                i = 0;
              }
            }
        });
      }
  });
  }
}

updateTestimonials();
setInterval(updateTestimonials,time);

A Codepen to showcase the problem

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）

anime.jsarraysarraysjavascriptloops