Seite löschen, ohne Seite neu zu laden?

Question

Ich habe ein einfaches Spiel, das eine Zufallszahl erzeugt und eine Benutzereingabe nimmt, wo der Benutzer versucht, die Zahl zu erraten, und der Code hängt jede Benutzerschätzung an eine Liste an, damit sie wissen, welche Zahlen sie erraten haben. Es gibt auch ein "neues Spiel" (.new) Link oben, das der Benutzer jederzeit treffen kann, um von vorne zu beginnen. Zur Zeit habe ich folgende js:

/*--- Reset game ---*/ 
$(".new").click(function() { 
    location.reload(); 
}); 

Während dies funktioniert, würde ich es vorziehen, den Betrieb so zu ändern, dass die Seite nicht aktualisiert werden muss, sondern setzt den Code an den Anfang (dh eine neue Zufall erzeugt Nummer, löscht die Listenelemente usw.)

Nicht sicher, wie man das macht. Irgendwelche Ideen?

Answer 1

Haben Sie eine Funktion, die die Zufallszahl erstellt und sie jedes Mal aufruft, wenn auf ein neues Spiel geklickt wird. So zum Beispiel haben eine Funktion generateRandomNumber() und es verwendet, die folgende Art und Weise genannt:

/*--- Reset game ---*/ 
$(".new").click(function() { 
    generateRandomNumber(); //Function to start everything from the beginning 
}); 

Answer 2

Sie eine Liste haben könnten, und wenn Benutzer ihre Vermutung überprüft, in die Liste ein Element. Für die neue, einfach alle li-Elemente aus der Liste und entfernen Sie sie.

Zwei Schaltflächen, new und check, und zwei Klickereignisse. Ich habe eine schnelle Skizze gemacht:

https://codepen.io/anon/pen/oxVKJB

Sie es mit der Erzeugung von Zufallszahlen, Validierung und Sachen vollenden können.