1

I'm trying to make a little game on html about random numbers, you have to try to get a number between 45 and 55, and you can try more than one number at once (1-5), but it will make numbers variate more, for example:

Got 33, 65, 12, 89. The player did 4 attempts so:

33 + random{-1,1} * (random[1,3] ** 4) (this with each number)

numbers are stored in nums. After created, they are modified, and then, a "filter" will check if some of them are between 45 and 55, if so, that numbers are pushed inside winner and shown. A different pup up will appear if there is no winning number.

The problem:

When try it on Dcoder the interface will just disappear and console will throw me some errors.

PS: I dedicated a few lines of code to create a log, to make sure if everything was ok with the numbers, this helped me a lot fixing something without having to ask someone, but this time it escaped off from my hands and knowledge.

81 added 53 added 90 modified 54 modified 90 rejected 54 approved 54 Uncaught ReferenceError: start is not defined Uncaught ReferenceError: onHasParentDirectory is not defined Uncaught ReferenceError: addRow is not defined Uncaught ReferenceError: addRow is not defined Uncaught ReferenceError: addRow is not defined

Another question, I want to put a counter of: Times played, Total amount of attempts, winning attempts, losing attempts. In a text on the page, how to make text variate based on the value of a var in the js code?

function GtData() {
   var r = [Number(document.getElementById("amAtt").value)];
   return r
}

function Evt() {
   var Data = GtData();
   if (1 <= Data && Data <= 5) {
      var nums = [];
      for (i = 0; i < Data; i++) {
         nums.push(Math.floor(Math.random() * 101));
         console.log(nums[i] + " added");
      }
      var coef = Math.round(Math.random());
      var soa = 0;
      if (coef == 1) {
         soa++
      }
      else {
         soa--
      }
      for (i = 0; i < nums.length; i++) {
         nums[i] += soa * (Math.floor(Math.random() * 3 + 1) ** Data);
         console.log(nums[i] + " modified");
      }
      var winner = [];
      for (i = 0; i < nums.length; i++) {
         if (45 <= nums[i] && nums[i] <= 55) {
            winner.push(nums[i]);
            console.log(nums[i] + " approved");
         }
         else {
            console.log(nums[i] + " rejected");
         }
      }
      var r = winner;
      console.log(r);
      if (r.length != 0) {
         window.alert("We got a winner: " + r + " !");
      }
      else {
         window.alert("No luck boy...");
      }
   }
}
.center {
  display: block;
  text-align: center;
  width: 50%;
  padding: 8px;
  margin: auto;
  border: 8px double;
}
.button {
  display = "block";
}
<html>
   <head> 
   </head>
   <body>
      <form>
         <p class="center">Amount of attempts!<br>
         <input type="number" class="center" id="amAtt" placeholder="1 - 5" min="1" max="5" required=""><br>
         <input type="submit" class="center" onclick="Evt()"></p>
      </form>
   </body>
</html>
AylanJ123
  • 43
  • 1
  • 6

1 Answers1

1

The reason your HTML disappears is because you wrapped your code in <form> and form will automatically reload the page.

To resolve it, change:

<input type="submit" class="center" onclick="Evt()"></p>

to:

event.preventDefault(), Evt()

https://www.w3schools.com/jsref/event_preventdefault.asp

Salmin Skenderovic
  • 1,750
  • 9
  • 22