drucken :: thefox: 21.01.2012

züfallig sortieren / mischen

Wie man mit jQuery Unterelement zufällig sortieren kann

JavaScript


jQuery.noConflict();

jQuery(document).ready(function($){
  $('a.torandomsort').click(function(e) {
    e.preventDefault();
    mischen();
    return true;
  });
});

function mischen() {
  (function($) {
    var max = $('#myParent li.item').length;
    $('#myParent').children('li.item').sort(function(a,b){
      return Math.floor(Math.random()* max);
    }).appendTo($('#myParent'));
  })(jQuery);
}

HTML Code


<ul id="myParent">
<li class="item">LI-Element 1</li>
<li class="item">LI-Element 2</li>
<li class="item">LI-Element 3</li>
<li class="item">LI-Element 4</li>
<li class="item">LI-Element 5</li>
<li class="item">LI-Element 6</li>
<li class="item">LI-Element 7</li>
</ul>
<a href="#" class="torandomsort">neu mischen</a>

Demo

  • LI-Element 1
  • LI-Element 2
  • LI-Element 3
  • LI-Element 4
  • LI-Element 5
  • LI-Element 6
  • LI-Element 7
neu mischen