骰子、变量函数、数组切片、新按钮、不同的函数
Dices, variable function(s), array slice, new button, different function
我是 JavaScript 的新手,我需要一些 ideas/help 来了解如何让我的脚本工作。
所以这个想法是,你掷两个骰子,通过按下 "roll" 按钮然后按下重置所有内容的重置按钮来滚动,总的来说 HTML。
所以这是交易,假设双眼都显示“5”,所以“5”应该从 array/function 中删除,如果再次按下 "roll" 按钮,则两个骰子应该只能落在 1、2、3、4 和 6 上,然后如果两个骰子显示相同的数字,它会继续从 array/function 中删除数字。
还有rest按钮,完全重置所有内容。
function rollDice() {
//var points = new Array(1,2,3,4,5,6);
var a = new Array(1,2,3,4,5,6);
var die1 = document.getElementById("die1");
var die2 = document.getElementById("die2");
var status = document.getElementById("status");
var d1 = a[Math.floor(a.length * Math.random())];
var d2 = a[Math.floor(a.length * Math.random())];
var diceTotal = d1 + d2;
die1.innerHTML = d1;
die2.innerHTML = d2;
if(d1 == d2){
function nyroll() {
var b = new Array(1,2,3);
var die1 = document.getElementById("die1");
var die2 = document.getElementById("die2");
var status = document.getElementById("status");
var d1 = b[Math.floor(b.length * Math.random())];
var d2 = b[Math.floor(b.length * Math.random())];
var diceTotal = d1 + d2;
die1.innerHTML = d1;
die2.innerHTML = d2;
}
这是我的职责,所以票价。我在想,如果我可以用某种变量函数来实现它,对于 onClick 按钮,那么它 运行 的函数将取决于删除了哪些数字。
像这样的?您可以在控制台中查看数组,因为它变小了,因为 d1 == d2
值从可用数字数组中删除了。
var a = [1, 2, 3, 4, 5, 6];
var die1 = document.getElementById("die1");
var die2 = document.getElementById("die2");
var numbersLeft = document.getElementById("numbersLeft");
function rollDice() {
console.log(a);
if (a.length > 0) {
var d1 = a[Math.floor(a.length * Math.random())];
var d2 = a[Math.floor(a.length * Math.random())];
die1.innerHTML = d1;
die2.innerHTML = d2;
if (d1==d2) {
console.log(d1);
var index = a.indexOf(d1);
if (index > -1) {
a.splice(index, 1);
}
}
}
else { alert('all numbers have been used.'); }
}
function reset() {
a = [1, 2, 3, 4, 5, 6];
die1.innerHTML = '';
die2.innerHTML = '';
}
.die {
border: 1px solid black;
width: 30px;
height: 30px;
display:inline-block;
margin:10px;
padding:10px;
text-align: center;
vertical-align: middle;
background-color:lightgray;
}
<a href="#" onclick="rollDice()">Roll Dice</a><br/><br/>
<a href="#" onclick="reset()">Reset</a><br/><br/>
<div class="die" id="die1"></div>
<div class="die" id= "die2"></div>
我是 JavaScript 的新手,我需要一些 ideas/help 来了解如何让我的脚本工作。 所以这个想法是,你掷两个骰子,通过按下 "roll" 按钮然后按下重置所有内容的重置按钮来滚动,总的来说 HTML。
所以这是交易,假设双眼都显示“5”,所以“5”应该从 array/function 中删除,如果再次按下 "roll" 按钮,则两个骰子应该只能落在 1、2、3、4 和 6 上,然后如果两个骰子显示相同的数字,它会继续从 array/function 中删除数字。
还有rest按钮,完全重置所有内容。
function rollDice() {
//var points = new Array(1,2,3,4,5,6);
var a = new Array(1,2,3,4,5,6);
var die1 = document.getElementById("die1");
var die2 = document.getElementById("die2");
var status = document.getElementById("status");
var d1 = a[Math.floor(a.length * Math.random())];
var d2 = a[Math.floor(a.length * Math.random())];
var diceTotal = d1 + d2;
die1.innerHTML = d1;
die2.innerHTML = d2;
if(d1 == d2){
function nyroll() {
var b = new Array(1,2,3);
var die1 = document.getElementById("die1");
var die2 = document.getElementById("die2");
var status = document.getElementById("status");
var d1 = b[Math.floor(b.length * Math.random())];
var d2 = b[Math.floor(b.length * Math.random())];
var diceTotal = d1 + d2;
die1.innerHTML = d1;
die2.innerHTML = d2;
}
这是我的职责,所以票价。我在想,如果我可以用某种变量函数来实现它,对于 onClick 按钮,那么它 运行 的函数将取决于删除了哪些数字。
像这样的?您可以在控制台中查看数组,因为它变小了,因为 d1 == d2
值从可用数字数组中删除了。
var a = [1, 2, 3, 4, 5, 6];
var die1 = document.getElementById("die1");
var die2 = document.getElementById("die2");
var numbersLeft = document.getElementById("numbersLeft");
function rollDice() {
console.log(a);
if (a.length > 0) {
var d1 = a[Math.floor(a.length * Math.random())];
var d2 = a[Math.floor(a.length * Math.random())];
die1.innerHTML = d1;
die2.innerHTML = d2;
if (d1==d2) {
console.log(d1);
var index = a.indexOf(d1);
if (index > -1) {
a.splice(index, 1);
}
}
}
else { alert('all numbers have been used.'); }
}
function reset() {
a = [1, 2, 3, 4, 5, 6];
die1.innerHTML = '';
die2.innerHTML = '';
}
.die {
border: 1px solid black;
width: 30px;
height: 30px;
display:inline-block;
margin:10px;
padding:10px;
text-align: center;
vertical-align: middle;
background-color:lightgray;
}
<a href="#" onclick="rollDice()">Roll Dice</a><br/><br/>
<a href="#" onclick="reset()">Reset</a><br/><br/>
<div class="die" id="die1"></div>
<div class="die" id= "die2"></div>