2010-02-06 7 views
1

J'essaie d'obtenir une cellule aléatoire dans jquery, entre 1-16, j'ai le code de nombre aléatoire en Javascript. Maintenant, ce que je veux faire est d'utiliser ce nombre aléatoire, et faire le pointeur de la table aller à ce nombre aléatoire? Comment cela serait-il accompli. Voici mon code numérique aléatoire.Obtenir une cellule aléatoire d'une table dans jQuery

Math.floor(Math.random() * 16) 

    <table id="board" border="3" bgcolor="black" align="center"> 
     <tr> 
     <td></td> 
     <td></td> 
     <td></td> 
     <td></td> 
     </tr> 
     <tr> 
     <td></td> 
     <td></td> 
     <td></td> 
     <td></td> 
     </tr> 
     <tr> 
     <td></td> 
     <td></td> 
     <td></td> 
     <td></td> 
     </tr> 
     <tr> 
     <td></td> 
     <td></td> 
     <td></td> 
     <td></td> 
     </tr> 
    </table> 
    <input type="button" value="Shuffle" onclick="shuffle()"/> 
    </body> 
</html> 

Ce que je fait l'ai dit est fait référence, je veux obtenir une référence à une cellule aléatoire en utilisant le code de générateur aléatoire en javascript

$('board tr td') 

Cela devrait me donner un moyen d'entrée dans la table

+3

S'il vous plaît prendre le temps de fournir plus d'informations, comme le code de la table, et une explication de ce que vous voulez accomplir. Je ne sais pas ce que signifie "faire le pointeur de la table". – user113716

+1

Juste au cas où personne d'autre ne le mentionne, vous ciblez la table avec un identifiant de "tableau" en utilisant ce sélecteur jQuery '$ ('# board')'. Votre code ci-dessus manque le hash #. – Mottie

Répondre

2

Une solution spécifique jQuery est d'attribuer un événement de clic sur le bouton en javascript, et mettre FiveTools solution de code là.

<input type="button" value="Shuffle" id="theButton"/> 

javascript:

$('document').ready(function() { 

$('#theButton').click(function() { 

    // Stores a random number from 0 to 15 
    var randomNum = Math.floor(Math.random() * 16); 

    // This brings you back up to a range of 1 to 16 
    var actualNum = randomNum + 1; 

    // Grabs and holds the table cell for that number 
    // Example: number 10 would be third row, second column 
    var randomtd = $('#board td').eq(randomNum); 

    // Calculate and store which row 
    // by dividing the generated number by the number of rows, and rounding up 
    var whichRow = Math.ceil(actualNum/4); 

    // Calculate and store which column 
    // by using modulo to find the remainder of the number divided by the rows 
    // If the modulo result is '0', then set it to '4' 
    var whichColumn = (actualNum % 4) == 0 ? 4 : (actualNum % 4); 

    // Display results in an alert 
    alert('theNumber: ' + actualNum + ' row: ' + whichRow + ' column: ' + whichColumn); 

    // For fun, and to show that you have the td stored 
    // Display the number in the correct td 
    // and set the text color to grey, since the table is black 
    randomtd.text(actualNum).css({color:'#DDD'}); 
}); 

}); 
+1

Je pense qu'au lieu d'utiliser '16', je remplacerais cela par le nombre de' 'comme ceci:' var randomNum = Math.floor (Math.random() * $ ('td'). Longueur) 'de cette façon, vous pouvez modifier la taille de la table et ne pas avoir à changer le code – Mottie

+0

@fudgey - Bonne idée. Le rend flexible. Je vais ajouter cette option. – user113716

+0

Eh bien, il a donné des résultats de randoms mais ce que je voulais, c'est un moyen d'obtenir la cellule radom, et aussi obtenir la position de la cellule aléatoire. Supposons que je reçoive aléatoirement le numéro 10, alors je veux aussi arriver au numéro de cellule 10 aussi. Btw Im travaillant avec une table 4x4. – Zerobu

1

var randomNum = Math.floor (Math.random() * 16);
var randomtd = $ ('td') éq. (RandomNum - 1)

Questions connexes