8
votes

Ajout de la classe choisi au hasard à la balise HTML à l'aide de jQuery

Vous devez faire est dans mon menu, je voudrais ajouter l'une des classes (énumérées ci-dessous) avec un ordre entièrement aléatoire à chaque fois que la fonction démarre (charge de page)

Ceci est mon HTML P> xxx pré>

Et c'est ce que je voudrais avoir à la suite de chaque fois que chaque fois ordre de classes ajoutées p> xxx pré>

ci-dessous j'ai répertorié tout Les classes. P>

.li-one .li-two .li-three .li-four .li-five


2 commentaires

Regardez dans math.random () pour JavaScript. Où êtes-vous coincé exactement? Savez-vous comment appliquer une classe dans jQuery (c'est-à-dire utiliser un sélecteur?)


Il ne veut vraiment pas de cours vraiment aléatoires. Il veut qu'ils soient tous épuisés sans dupliqués, il semble.


5 Réponses :


1
votes

Je jetterais un coup d'oeil à http://blog.mastykarz.nl/jquery- Filtre aléatoire /

for (c in ['li-one', 'li-two', 'li-three', 'li-four', 'li-five'])
       // select the next link w/o a class starting with "li"
       $("a:not(class^=li):random").addClass(c);


0 commentaires

10
votes

quelque chose comme ce qui suit: xxx


0 commentaires

5
votes

Utiliser jQuery, vous pouvez faire quelque chose comme xxx


2 commentaires

Cela pourrait affecter la même classe à deux divs différents.


Oui, je n'ai pas réalisé qu'il ne voulait vraiment pas qu'ils soient aléatoires avant d'avoir répondu. Je vais laisser ici et donner Karim79 la bosse.



0
votes

Cela entraînera une bien meilleure hausse des noms de classe que la fonction aléatoire ordinaire: xxx


0 commentaires

0
votes
 <script type="text/javascript">
 var style=new Array('li-one','li-two','li-three','li-four','li-five');
 var l=style.length;
 $(document).ready(function(){
  var t=(new Date()).getSeconds()%l;

  if(t>l){ while(t>l) t=(new Date()).getSeconds()%l; }

  var i=t;

  $("div#menu ul li a").each(function(a,b){
   if(i<l){
    $(b).addClass(style[i++]);
   }else{
    if(t>=0){
     $(b).addClass(style[--t]);
    }
   }
  });
 });
 </script>

0 commentaires