I'm currently a rookie coder, so I will need some help.

I would like to show a random string of text in an html field on page load/reload. I would like it to pick a random string of text from a list that I have.

Oh, also, by the way, could I have a JsFiddle link (if possible)

~ Thanks, Calo

I'm currently a rookie coder, so I will need some help.

I would like to show a random string of text in an html field on page load/reload. I would like it to pick a random string of text from a list that I have.

Oh, also, by the way, could I have a JsFiddle link (if possible)

~ Thanks, Calo

• javascript
• html

• 4 Show us some of your attempts – Cliff Burton Commented Apr 28, 2018 at 12:01
• 2 Stackoverflow is not a free coding service. Read How to Ask, and take a tour – Roko C. Buljan Commented Apr 28, 2018 at 12:05

4 Answers 4

This should do it. You can simply add more sentences to the array holding the samples.

var texts = [
  "I am a sentence.",
  "Some nice stuff.",
  "I am random too!"
];

document.getElementById('randomText').value = texts[Math.floor(Math.random()*texts.length)];

<input type="text" id="randomText">

On every reload it will show random number.

// find elements
var banner = $("#banner-message-text")
banner.val(parseInt(Math.random()*18546876546));

body {
  background: #20262E;
  padding: 20px;
  font-family: Helvetica;
}

#banner-message {
  background: #fff;
  border-radius: 4px;
  padding: 20px;
  font-size: 25px;
  text-align: center;
  transition: all 0.2s;
  margin: 0 auto;
  width: 300px;
}

button {
  background: #0084ff;
  border: none;
  border-radius: 5px;
  padding: 8px 14px;
  font-size: 15px;
  color: #fff;
}

#banner-message.alt {
  background: #0084ff;
  color: #fff;
  margin-top: 40px;
  width: 200px;
}

#banner-message.alt button {
  background: #fff;
  color: #000;
}

<script src="https://ajax.googleapis./ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="banner-message">
  <input type="text" id="banner-message-text"/>
</div>

let messages = ["Hi", "Hey", "Hello", "Please make some attempts", "holla"];
 // We can use inbuilt Math object to perform mathematical operations.
 // to get a random number between 0 and the total size of messages array, we can use it as follows. 
 // Math.floor will return the largest integer which is less than or equal to that random number.
    let message = messages[Math.floor(Math.random()*messages.length)];

// to select your input element and set default value, you can do
$('input').val(message);

Ref : https://developer.mozilla/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math

You can utilize a function to obtain a random item from a given list:

const phrases = [
  "All the world's a stage",
  "Hope is the thing with feathers",
  "Life is a journey",
  "Time is a thief",
  "Books are the mirrors of the soul",
  "The world is your oyster",
  "Memory is a crazy woman that hoards colored rags and throws away food",
  "A heart of stone",
  "The curtain of night",
  "A sea of troubles"
];

// Function that takes a list of items, and returns a random item
const randomItem = (arr) => arr[Math.floor(Math.random() * arr.length)];

document.querySelector('#random-phrase').value = randomItem(phrases);

*, *::before, *::after { box-sizing: border-box; }
html, body { width: 100%; height: 100%; margin: 0; padding: 0; }
body { display: flex; align-items: center; justify-content: center; padding: 1rem; }
#random-phrase { flex: 1; }

<input type="text" id="random-phrase" placeholder="A random phrase...">