jquery - shuffle and sort using javascript -
i new javascript, trying draw number grid having values 1-9. 2 buttons shuffle , sort them on click . the grid looking for
i able shuffle numbers, not able assign them divs. appreciated.
also need on passing hex color values (shown in img) each div.
$(".btn_shuffle").click(function () { var cardnumbers = []; $('.card').each(function () { cardnumbers.push(this.innerhtml); }); var thelength = cardnumbers.length-1; var toswap ; var temp; console.log(cardnumbers); for(i=thelength; i>0; i--){ toswap = math.floor(math.random()*i); temp = cardnumbers[i]; cardnumbers[i] = cardnumbers[toswap]; cardnumbers[toswap]=temp; } console.log(cardnumbers); });
$(".btn_shuffle").click(function () { var cardnumbers = []; $('.card').each(function () { cardnumbers.push(this.innerhtml); }); var thelength = cardnumbers.length-1; var toswap; var temp; // console.log(cardnumbers); (var = thelength; > 0; i--) { toswap = math.floor(math.random() * (i + 1)); temp = cardnumbers[i]; cardnumbers[i] = cardnumbers[toswap]; cardnumbers[toswap] = temp; } // console.log(cardnumbers); // adding them back, =0 above loop, use again $('.card').each(function () { this.innerhtml=cardnumbers[i]; i++; }); // });
#shuffle > div { float: left; line-height: 30px; width: 50px; text-align: center; background-color: steelblue; color: #fff; border-radius: 4px; margin: 3px; } #shuffle { max-width: 360px; }
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <button class="btn_shuffle" id="shuffle">shuffle</button> <button class="btn_sort">sort</button> <div id="shuffle"> <div class="card">1</div> <div class="card">2</div> <div class="card">3</div> <div class="card">4</div> <div class="card">5</div> <div class="card">6</div> <div class="card">7</div> <div class="card">8</div> <div class="card">9</div> </div>
Comments
Post a Comment