I am looking to create a function asking the user for how many numbers must be generated randomly in a series of 200 numbers i.e from 0 to 200.
THanks
Maybe it is what you want:
<!DOCTYPE html>
<html>
<body>
<button onclick="myFunction()">Click here</button>
<ul id="list"></ul>
<script>
var RAND_MIN = 0;
var RAND_MAX = 200;
function randomInt(low, high) {
return Math.floor(Math.random() * (high - low) + low);
}
function myFunction() {
var answer = prompt("How many numbers must be generated randomly in a series of 200");
if (answer != null) {
var n = parseInt(answer, 10);
var list = document.getElementById("list");
for (var i = 0; i < n; ++i) {
var li = document.createElement("li");
li.appendChild(document.createTextNode(randomInt(RAND_MIN, RAND_MAX)));
list.appendChild(li);
}
}
}
</script>
</body>
</html>
Related
Hello here I'm trying to Output my function on two separate divs in my project but if I simply output the same I'd it cancels the whole code and nulls the output here is the code.
<script>
function randomString() {
//initialize a variable having alpha-numeric characters
var chars = "0123456789ABCDEFGHIJKLMNOPQRSTUVWXTZabcdefghiklmnopqrstuvwxyz";
//specify the length for the new string to be generated
var string_length = 10;
var randomstring = '';
//put a loop to select a character randomly in each iteration
for (var i=0; i<string_length; i++) {
var rnum = Math.floor(Math.random() * chars.length);
randomstring += chars.substring(rnum,rnum+1);
}
//display the generated string
document.getElementById("randomfield").innerHTML = randomstring;
}
</script>
Then on the body I use
<body onload="randomString();">
<div>
<p id="randomfield"></p>
</div>
</body>
The thing is I want to Output the same string on the page but on a different div maybe at the footer but if I proceed to add
<body onload="randomString();">
<div>
<p id="randomfield"></p>
</div>
<hr>
<footer>
<p id="randomfield"></p>
</footer>
</body>
On the same page it cancels the whole code and nullifies the output. How do I fix this i barely have knowledge of Js
You are using the same id in both areas. You have to specify different id to have them work:
function randomSSSSSString() {
//initialize a variable having alpha-numeric characters
var charssssss = "0123456789ABCDEFGHIJKLMNOPQRSTUVWXTZabcdefghiklmnopqrstuvwxyz";
//specify the length for the new string to be generated
var sssssstring_length = 10;
var randomsssssstring = '';
//put a loop to select a character randomly in each iteration
for (var i = 0; i < sssssstring_length; i++) {
var rrrrrrnum = Math.floor(Math.random() * charssssss.length);
randomsssssstring += charssssss.substring(rrrrrrnum, rrrrrrnum + 1);
}
//display the generated string
document.getElementById("rrrrrrandomfield").innerHTML = randomsssssstring;
document.getElementById("rrrrrrandomfield2").innerHTML = randomsssssstring;
}
<body onload="randomSSSSSString();">
<div>
<p id="rrrrrrandomfield"></p>
</div>
<hr>
<footer>
<p id="rrrrrrandomfield2"></p>
</footer>
</body>
This is happening because you're using same "id" more than once, which is not valid.
You can change the id to class instead and can use querySelectorAll to loop through each element consisting of that class to display your result.
function randomSSSSSString() {
//initialize a variable having alpha-numeric characters
var charssssss = "0123456789ABCDEFGHIJKLMNOPQRSTUVWXTZabcdefghiklmnopqrstuvwxyz";
//specify the length for the new string to be generated
var sssssstring_length = 10;
var randomsssssstring = '';
//put a loop to select a character randomly in each iteration
for (var i=0; i<sssssstring_length; i++) {
var rrrrrrnum = Math.floor(Math.random() * charssssss.length);
randomsssssstring += charssssss.substring(rrrrrrnum,rrrrrrnum+1);
}
//display the generated string
var i_want_show_here = document.querySelectorAll(".rrrrrrandomfield")
Array.prototype.forEach.call(i_want_show_here, function(el) {
el.innerHTML = randomsssssstring
});
}
<body onload="randomSSSSSString();">
<div>
<p class="rrrrrrandomfield"></p>
</div>
<hr>
<footer>
<p class="rrrrrrandomfield"></p>
</footer>
</body>
I think you can solve this by creating dynamic p tag with same id. There is no var datatype in javascript change it to let.
function randomString() {
let characters = "0123456789ABCDEFGHIJKLMNOPQRSTUVWXTZabcdefghiklmnopqrstuvwxyz";
let randnum = document.getElementById("randnum")
let stringLength = 10;
let tempRandomString = '';
for (let i = 0; i < stringLength; i++) {
let randNum = Math.floor(Math.random() * characters.length);
tempRandomString += characters.substring(randNum, randNum + 1);
}
for (var i = 0; i < 2; i++) {
const elem = document.createElement(`p`);
elem.id = tempRandomString;
elem.innerText= tempRandomString;
randnum.appendChild(elem);
}
}
<html>
<title>Web Page</title>
<head>
</head>
<body onload="randomString();">
<div id="randnum">
</div>
</body>
</html>
Alright, in my results for my program the results are displayed in a horizontal list (for e.x, HI,HELLO,HI,HELLO). I am trying to get these results to be in a numbered list from top to bottom.
function button() {
var inputArray = [];
var size = 4;
for (var i = 0; i < size; i++) {
inputArray[i] = prompt('Enter Element ' + (i + 1));
inputArray.sort();
document.getElementById("demo").innerHTML =
inputArray.map(function(x) {
return x.toUpperCase()
});
}
var str = String(inputArray).toUpperCase().split(",");
}
<button onclick="button();">Array</button>
<p id="demo"></p>
https://repl.it/repls/DangerousCloudyNumber
Just use an ordered list (<ol>) instead of a paragraph (<p>) and add list items (<li>) to the values while mapping them:
function button(){
var inputArray = [];
var size = 4;
for(var i=0; i<size; i++) {
inputArray[i] = prompt('Enter Element ' + (i+1));
inputArray.sort();
document.getElementById("demo").innerHTML = inputArray.map(function(x){ return "<li>"+x.toUpperCase()+"</li>"}).join("");
}
var str = String(inputArray).toUpperCase().split(",");
}
<!DOCTYPE html>
<html>
<head>
<script src="script.js"></script>
<meta charset="utf-8">
<title>Program</title>
</head>
<body>
<button onclick="button();">Array</button>
<ol id="demo"></ol>
</body>
</html>
function button(){
var inputArray = [];
var size = 4;
var final_html = "<ol>"
for(var i=0; i<size; i++) {
input = prompt('Enter Element ' + (i+1));
if (input === null) {
document.getElementById("demo").innerHTML = inputArray.map(function(x){
if (x != null) {
final_html = final_html +"<li>"+x.toUpperCase()+"</li>";
}
});
document.getElementById("demo").innerHTML = final_html;
return; //break out of the function early
}else{
inputArray[i] = input;
}
inputArray.sort();
}
}
How can display a new random number with each new line element?
Currently, my HTML is displaying
The number is 4
The number is 4
The number is 4
The number is 4
The number is 4
I would like it to show a random number with each line.
The number is 4
The number is 1
The number is 9
The number is 3
The number is 11
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
<div id="info">
</div>
<script src="main.js"></script>
</body>
</html>
var divInfo = document.getElementById('info');
var quote = document.createElement('p');
var randNum = Math.floor(Math.random() * 11) + 1;
var messNum = '';
for (var i = 0; i < 5; i++) {
messNum = "The number is " + randNum + "</br>";
divInfo.appendChild(quote);
quote.innerHTML += messNum;
}
You are assigning randNum once outside of your for loop.
Put randNum = Math.floor(Math.random() * 11) + 1; as your first line inside the for loop, that way it changes with every iteration
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
<div id="info">
</div>
<script src="main.js"></script>
</body>
</html>
var divInfo = document.getElementById('info');
var quote = document.createElement('p');
var messNum = '';
for (var i = 0; i < 5; i++) {
var randNum = Math.floor(Math.random() * 11) + 1;
messNum = "The number is " + randNum + "</br>";
divInfo.appendChild(quote);
quote.innerHTML += messNum;
}
You have to calculate the random number inside the for loop. So for each line it will get a different number like this:
for (var i = 0; i < 5; i++) {
// calculate random here
var randNum = Math.floor(Math.random() * 11) + 1;
messNum = "The number is " + randNum + "</br>";
// ...
You have a good start. Just move your call to generate the random number inside your for-loop. Try this:
<script>
var divInfo = document.getElementById('info');
var quote = document.createElement('p');
var randNum;
var messNum = '';
for (var i = 0; i < 5; i++) {
randNum = Math.floor(Math.random() * 11) + 1;
messNum = "The number is " + randNum + "</br>";
divInfo.appendChild(quote);
quote.innerHTML += messNum;
}
</script>
Here's a jsfiddle for it.
I have a program that is supposed to take two numbers entered by the user and send them to a function. This function will be used to determine all the prime numbers between those two numbers. However, I just can't seem to figure out how to find all the primes. I created an array that should hold all numbers between the two user submitted ones. But I don't know how to iterate through it and place all the prime numbers found into a new array. I know it's basic stuff, but for some reason I just can't figure it out.
Here's the code for my function so far.
function displayPrimeNumbers(p1, p2) {
var numbers = [];
var primes = [];
for(i = p2; i == p1; i++){
numbers.push(i);
for(i = 0; i < numbers.length; ++i){
if () {
}
}
}
}
<html>
<head>
<script = "text/javascript>
function prime(num1,num2)
{
var s="";
var count=0;
for(i=parseInt(num1);i<num2;i++)
{
for(j=2;j<i;j++)
{
if(i%j==0)
{
count ++ ;
}
}
if(count == 0)
{
s=s+"\n"+i;
}
count = 0;
}
document.getElementById('textarea1').value = s;
}
</script>
</head>
<body>
<input type = "text" id = "num1">
<input type = "text" id = "num2">
<input type = "button" value = "Click here" onclick = "prime(document.getElementById('num1').value,document.getElementById('num2').value)"><br>
<textarea id = "textarea1" rows="10" cols = "20">answer</textarea>
</body>
</html>
The code below appends numbers in sequence from 1 to 10 when the start button is clicked. I'd like to use clearTimeout to cancel the operation when the stop button is clicked.
It seems to me that a dynamic variable must be created (where x is currently assigned the doSetTimeout function), but I have not yet found a way to do so. Any suggestions?
Thanks!
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script>
function doSetTimeout(func, func_param, time) {
setTimeout(function(){func(func_param);}, time);
}
function createNode(base) {
var node = document.createElement("p");
var writeI = base + "";
var textnode = document.createTextNode(writeI);
node.appendChild(textnode);
document.body.appendChild(node);
}
$(document).ready(function() {
$("#start").click(function() {
for (var i = 1; i <= 10; i++) {
var time = i*1000;
var x = doSetTimeout(createNode, i, time);
}
});
});
</script>
</head>
<body>
<button id="start">Start</button>
<button id="stop">Stop</button>
</body>
Get the return value of setTimeout, keep it in a list, and clear it when you click stop.
function doSetTimeout(func, func_param, time) {
return setTimeout(function(){func(func_param);}, time);
}
$(document).ready(function() {
var timeouts = [];
$("#start").click(function() {
for (var i = 1; i <= 10; i++) {
var time = i*1000;
timeouts.push(doSetTimeout(createNode, i, time));
}
});
$("#stop").click(function () {
for (var i = 0; i <= timeouts.length; i += 1) {
clearTimeout(timeouts[i]);
}
});
});
This might also clear timeouts that have already finished, but I doubt that's really very important.