Generate Zufallszahl, die nicht im Array

Question

Hoffnung ist, kann ich gut erklären.

So habe ich 8 Boxen mit Klasse .boxA mit einem numerischen Wert von js generiert:

<div class="tfooter"> 
    <div class="boxA" id="bx3" value="3">3</div> 
    <div class="boxA" id="bx27" value="27">27</div> 
    <div class="boxA" id="bx46" value="46">46</div> 
    <div class="boxA" id="bx40" value="40">40</div> 
    <div class="boxA" id="bx42" value="42">42</div> 
    <div class="boxA" id="bx29" value="29">29</div> 
    <div class="boxA" id="bx13" value="13">13</div> 
    <div class="boxA" id="bx1" value="1">1</div> 
</div> 

Als erstes habe ich alle Werte in einem Array drücken:

var randomnumber = Math.ceil(Math.random()*50); 
var array = []; 
$(".boxA").each(function(){ 
    var dNumber = $(this).attr('value'); 
    array.push(dNumber); 
}); 

Jede dieser Boxen eine Zufallszahl von 1 bis 50 enthalten.

Jetzt möchte ich eine andere Zufallszahl erzeugen und prüfen, ob sie im Array existiert. Falls vorhanden, erzeuge eine andere Zahl, bis sie in diesem Array eindeutig ist. Wenn einzigartig, erstellen Sie ein anderes div.

Ich habe versucht mit indexOf, mit inArray, mit while, aber ich kann es nicht funktionieren. Das Problem ist, dass generieren. Erzeuge eine neue Nummer, bis sie nicht im Array ist.

Vielen Dank!

Answer 1

Sie müssen $.inArray() verwenden, um zu überprüfen, ob die Zufallszahl in einem vorhandenen Array vorhanden ist oder nicht. Wenn die Nummer nicht existiert, fügt sie dem Array diese Zufallszahl hinzu. Im Folgenden finden Sie eine aktualisierte Code:

$("#generateNewNumber").on('click', function() { 
 
    var newArray = []; 
 
    $(".boxA").each(function() { 
 
    newArray.push(parseInt($(this).attr('value'))); 
 
    }); 
 

 
    var randomNumber = Math.ceil(Math.random() * 50); 
 
    console.log('Random number is: ' + randomNumber); 
 
    if ($.inArray(randomNumber, newArray) !== -1) { 
 
    console.log(randomNumber + ' exisits in array'); 
 
    } else { 
 
    newArray.push(parseInt(randomNumber)); 
 
    $(".tfooter").append('<div class="boxA" id="bx' + randomNumber + '" value="' + randomNumber + '">' + randomNumber + '</div>') 
 
    console.log(randomNumber + " doesn't exisits in array, hence adding in an array."); 
 
    } 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<button id="generateNewNumber">Generate Random Number</button> 
 
<div class="tfooter"> 
 
    <div class="boxA" id="bx3" value="3">3</div> 
 
    <div class="boxA" id="bx27" value="27">27</div> 
 
    <div class="boxA" id="bx46" value="46">46</div> 
 
    <div class="boxA" id="bx40" value="40">40</div> 
 
    <div class="boxA" id="bx42" value="42">42</div> 
 
    <div class="boxA" id="bx29" value="29">29</div> 
 
    <div class="boxA" id="bx13" value="13">13</div> 
 
    <div class="boxA" id="bx1" value="1">1</div> 
 
</div>

Answer 2

Sie die Trial-and-Error-Methode, indem man zuerst den Aufbau eines Arrays vermeiden konnte mit der Werte (dh diejenigen erlaubt, die in der Liste nicht angezeigt), und wählen Sie dann einen zufälligen Wert aus.

Hier ist ein Ausschnitt, der eine neue (nicht benutzt) Zahl an der Spitze der Liste auf der Knopfdruck hinzufügen wird:

function getUsedNumbers() { 
 
    return $(".boxA").map(function(){ 
 
     return +$(this).attr('value'); 
 
    }).get(); 
 
} 
 

 
function getCandidates(exclude) { 
 
    // Generate a list of values from 0 to 49, and make it a Set 
 
    // (Sets allow for faster look-up and value removal) 
 
    var candidates = new Set(Array(50).keys()); 
 
    for (value of exclude) { 
 
     // Remove the already used value from our Set: 
 
     candidates.delete(value); 
 
    } 
 
    // Convert Set back to array and return it: 
 
    return [...candidates]; 
 
} 
 

 
function pickRandomly(array) { 
 
    return array[Math.floor(Math.random()*array.length)]; 
 
} 
 

 
$('#add').click(function() { 
 
    var used = getUsedNumbers(); 
 
    var candidates = getCandidates(used); 
 
    // Safety: 
 
    if (!candidates.length) { 
 
     alert('No more candidate values available'); 
 
     return; 
 
    } 
 
    var choice = pickRandomly(candidates); 
 
    // Insert the selected number at the top of the list: 
 
    $(".tfooter").prepend(
 
     $("<div>").addClass("boxA").text(choice).attr({ 
 
      id: "bx"+choice, value: choice 
 
     }) 
 
    ); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<button id="add">Add</button> 
 
<div class="tfooter"> 
 
</div>

Wenn Sie tun dies immer wieder , dann ist es nicht so effizient, die Liste der Werte von der Seite jedes Mal neu zu lesen, da Sie tatsächlich wissen, was es bereits gibt.

Betrachten Sie die candidatesSet die Master-Referenz für Ihre Daten, und hängen nur davon ab, um die Ausgabe zu generieren.

Answer 3

Hier ist, wie ich hatte den Code gesetzt würde:

1. Erstellen Sie das Array mit den Zahlen 1-50 in ihm.
2. Erstellen Sie eine Zufallszahl basierend auf der Länge der Liste.
3. Spleißen Sie eine Position nach dem Zufallsprinzip. Diese Position wird dann aus dem Array entfernt, gibt aber ein Array mit einem Element zurück.
4. Wenn das Array leer ist (Länge 0), bei 1.

anfangen Dann müssen Sie nicht überprüfen, ob die Zahl existiert, weil sie bereits aus dem Array entfernt wurde.

function createBoxNumbersArray(startNumber, endNumber) { 
    var boxNumbers = []; 

    for (var i = startNumber; i <= endNumber; i++) { 
    boxNumbers.push(i); 
    } 

    return boxNumbers; 
} 

function getRandom(boxNumbers) { 
    position = Math.floor((Math.random() * boxNumbers.length-1)); 

    return boxNumbers.splice(position, 1)[0]; 
} 

var boxNumbers = createBoxNumbersArray (1, 50);

var randomBoxNumber = getRandom (boxNumbers);

Answer 4

Scheint wie indexOf wäre der Weg zu gehen. Ihr Problem besteht darin, dass Sie wahrscheinlich den HTML-Attributwert (eine Zeichenfolge) mit der Zufallszahl (einer Zahl) vergleichen.

so, wenn Sie aktualisieren:

array.push(parseInt(dNumber)); 

können Sie auch

if(array.indexOf(randomnumber) >= 0) { } // regenerate random