Question

何我将同一个类添加到两个元素中。现在，它为类名为“panzoom”的元素添加了两个不同的类。

<div class="panzoom modell1"></div>
<div class="panzoom modell1"></div>



jQuery(document).ready(function(){
       animatemodels();
   });

   function animatemodels() {
       var classes = [ 'modell1', 'modell2', 'modell3', 'modell4', 'modell5', 'modell6', 'modell7'];

       jQuery(".panzoom").each(function(){
           jQuery(this).removeClass('modell1 ' + classes.join(' ')).addClass(classes[~~(Math.random()*classes.length)]);
       });

       setTimeout(animatemodels, 7000);
   }

Answer 1

问题是你在每个循环的每次迭代中得到一个随机类。

相反，只需执行一次随机类生成 - 不需要each循环，jQuery会为你做这个

＆＃13;

var classes = ['modell1', 'modell2', 'modell3', 'modell4', 'modell5', 'modell6', 'modell7'];
var clazz = classes.join(' ');
jQuery(animatemodels);

function animatemodels() {
  jQuery(".panzoom").removeClass(clazz).addClass(clazz = classes[Math.floor(Math.random() * classes.length)]);
  setTimeout(animatemodels, 1000);
}

＆＃13;

.modell1 {
  background-color: red;
}
.modell2 {
  background-color: green;
}
.modell3 {
  background-color: blue;
}
.modell4 {
  background-color: lightgrey;
}
.modell5 {
  background-color: yellow;
}
.modell6 {
  background-color: grey;
}
.modell7 {
  background-color: lightblue;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="panzoom modell1">1</div>
<div class="panzoom modell1">2</div>

＆＃13;

将相同的类添加到Math.random函数中的多个元素

1 个答案: