show a variable called - Random

Question

show a variable called - Random

Hey there,

I've been struggling with a bug and despite multiple attempts, I can't seem to find a solution :(

I want a month to be displayed when clicked, and then on another click, a different month should appear without repeating the previous one.

Here's what I have so far:

As a beginner, I tried searching on Google but couldn't find an answer to my question.

function randomMonth() {
var months = "January, February, March, April, May, June, July, August, September, November, December".split(',');
var randMonths = [];

while (months.length) randMonths.push(months.splice(Math.random()*months.length, 1)[0]);
document.getElementById("month").innerHTML = randMonths;

 }

<button onclick="randomMonth()">Try it</button>

<p id="month"></p>

Thank you for your assistance :)

javascript random display

Answer 1

Answer №1

Here is a simple way to generate a random month:

function getRandomMonth() {
  var months = "January,February,March,April,May,June,July,August,September,October,November,December".split(',');
  var month = months[Math.floor(Math.random()*months.length)];
  document.getElementById('current-month').innerHTML = month;
}

<button onclick="getRandomMonth()">Generate Random Month</button>

<p id="current-month"></p>

Answer 2

Here is a simple way to generate a random month:

function getRandomMonth() {
  var months = "January,February,March,April,May,June,July,August,September,October,November,December".split(',');
  var month = months[Math.floor(Math.random()*months.length)];
  document.getElementById('current-month').innerHTML = month;
}

<button onclick="getRandomMonth()">Generate Random Month</button>

<p id="current-month"></p>

Answer 3

Answer №2

To achieve this, one can use the following method to create an empty array to store each month and check if it has already been displayed.

var tbl="janvier,février,mars,avril,mai,juin,juillet,août,septembre,novembre,décembre".split(',');
var randMois=[];

function randommonth() {
  var mois = tbl.splice(Math.random()*tbl.length,1)[0]; 
  console.log(randMois,mois)
  if(randMois.indexOf(mois)==-1 && randMois.length < tbl.length){
       randMois.push(mois)
       document.getElementById("mois").innerHTML = mois;
  }else{
      console.log("month already displayed",mois)
  }
 
 }

<button onclick="randommonth()">Try it</button>

<p id="mois"></p>

code sample - https://codepen.io/nagasai/pen/Yayxzj?editors=1010

Answer 4

To achieve this, one can use the following method to create an empty array to store each month and check if it has already been displayed.

var tbl="janvier,février,mars,avril,mai,juin,juillet,août,septembre,novembre,décembre".split(',');
var randMois=[];

function randommonth() {
  var mois = tbl.splice(Math.random()*tbl.length,1)[0]; 
  console.log(randMois,mois)
  if(randMois.indexOf(mois)==-1 && randMois.length < tbl.length){
       randMois.push(mois)
       document.getElementById("mois").innerHTML = mois;
  }else{
      console.log("month already displayed",mois)
  }
 
 }

<button onclick="randommonth()">Try it</button>

<p id="mois"></p>

code sample - https://codepen.io/nagasai/pen/Yayxzj?editors=1010

show a variable called - Random

Answer №1

Answer №2

Similar questions

Best practices for filtering data in an array of objects with multiple tags using React.js

Tips on modifying the style of a specific React component without affecting the others

Tips for modifying navbar appearance as user scrolls?

Utilizing sharejs to enhance collaborative editing with contenteditable sections

jQuery is unable to locate the FireBreath object

Ways to halt a CSS animation when it reaches the screen boundary

What is the procedure for altering a particular element using ajax technology?

The concatenation of Ajax results appears to append to the existing data

Discovering the bound ASP.NET AJAX event handlers for a specific DOM element

Disabling the scrollTop() effect following a click event with onClick()

Having trouble uploading files larger than 1MB with the combination of apollo-server-micro and NextJS

Drawing a line at each segment in a tube geometry using three.js

React Intersection Observer not functioning properly

In order for data with two fields to be displayed correctly in an angular.js table, it must be shown twice

Tips for sending an extra parameter to the callback function when using the loader.parse method in Three.js

What is the best way to split the vertices of a mesh in Three.js?

Restricting the amount of requests per user within a single hour [Node.js]

What is the best way to include an Interval in a button element?

Unable to "serialize" geoJSON information

Tips for minimizing a collection of objects?