CODEWITHSUNDEEP
javascript
user4945355
user4945355

Reputation:

How to dynamically create buttons based on random conditions

I have created a button using JavaScript, and I have a list that is supposed to get a random number when I "roll the dice"

I need to list of numbers to say "You rolled a 1" for example. How do I do that? And also I only need it to show the last 10 numbers. 

var rollNumber = 0;
var values = [];

function dieRolled() {
    rollNumber += 1;
    var numRolled = Math.ceil(Math.random() * 6);
    values.push(numRolled);
    document.getElementById("results").innerHTML = "";

    for (var x = values.length-1 ; x>=0; x--) {
        var newRoll = document.createElement("li");
        newRoll.innerHTML = values [x] +"You rolled a";
        document.getElementById("results").appendChild(newRoll);
        if (x == 11)break;
    }

}

Upvotes: 0

Views: 67

Answers (2)

Uma Kanth
Uma Kanth

Reputation: 5629

Try this:

var list = document.getElementById('demo');
var count = 0;
function changeText2() {
    count++;
    if(count <= 10)
    {
   var numRolled = Math.ceil(Math.random() * 6);
    var entry = document.createElement('li');
    entry.appendChild(document.createTextNode("You rolled:"+numRolled));
    list.appendChild(entry);
    }
}
<input type='button' onclick='changeText2()' value='Submit' />
<p>Dices you rolled</p>
<ol id="demo"></ol>

Upvotes: 2

NemoStein
NemoStein

Reputation: 2098

How about this?

	var output = document.getElementById("Output");
	var values = [];
	
	function roll()
	{
		values.push(Math.ceil(Math.random() * 6));
		
		// If the history is too big, drop the oldest...
		if (values.length > 10)
		{
			values.shift();
		}
		
		// Rewriting the history log
		var text = "";
		for (var i in values)
		{
			text += "You rolled a " + values[i] + "\n";
		}
		
		output.innerHTML = text;
	}
	
	// Rolling multiple times
	setInterval(function(){ roll(); }, 1000);
<pre id="Output"></pre>

Upvotes: 2

Related Questions