Question

我还是javascript和HTML新手。我的任务是从1到3生成2个随机整数值。按下“匹配！”按钮，警告框通知用户两个号码是否相同或不同。不知道为什么我的代码不起作用。任何帮助表示赞赏。

演示：https://jsfiddle.net/1rp5xvte/5/#&togetherjs=pJcEH56yoK

$(document).ready(function(){
function myFunction() 
{
    document.getElementById("generatedNum").innerHTML = Math.random();
{
    if (generateNum1 == generateNum2) {
        alert ("Both numbers are the same");
    }
    else {
        alert("Both numbers are different");
    }
    displayGeneratedNum ();
}
}

});

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Lab Report</title>
<script src="jquery.js"></script>
<script src="myScript.js"></script>

<style>
body{font-size:40px;
text-align:center;
background-color: antiquewhite;}
table {margin-top:100px;
background-color:white;}
td { width:150px;}
span {font-size:40px;}
#correctScore{
background-color:green;
}
#wrongScore{
background-color:red;

}
#missedScore{
background-color:blueviolet;

}
.numberStyle {
padding: 10px 10px 10px 10px; 
color:blue;
}

.numberStyle span {
font-size:100px;
}
</style>
</head>

<body>


<table width="800" border="1" align="center">
<tr>
<td id="generatedNum" colspan="6" align="left"><span>Random Numbers
generated : 1</span></td>
</tr>      
<tr>
<td colspan="3" align="center">Number 1</td>
<td colspan="3" align="center">Number 2</td>
</tr>    

<tr>
<td colspan="3" id="number1" class="numberStyle"><span>1</span></td>
<td colspan="3" id="number2" class="numberStyle"><span>2</span></td>
</tr>

<tr height="50px";>
<td colspan="6"><input type="button" value="MATCH!" style="font-size:50px;">        
</input></td>

</tr>
<tr>
<td>Correct:</td>
<td id="correctScore"><span>0<span></td>
<td><span>Wrong<span></td>
<td id="wrongScore"><span>0<span></td>
<td><span>Missed<span></td>
<td id="missedScore"><span>0<span></td>

</tr>
</table>

</body>
</html>

Answer 1

试试这段代码

<html><body><label id='lbl'></label><button id="btn">Match!</button><script src="https://code.jquery.com/jquery-2.2.1.min.js"></script><script>
function randomNumber(a,b)
    {
        if(b == undefined) {
            b = a - 1;
            a = 0;
        }
        var delta = b - a + 1;
        return Math.floor(Math.random()*delta) + a
    }

$(document).ready(function(){ 
 $('#btn').click(function()
 {
  var generateNum1 = randomNumber(1,3);
  var generateNum2 = randomNumber(1,3);

    if (generateNum1 == generateNum2) {
        alert ("Both numbers are the same");
    }
    else {
        alert("Both numbers are different");
    }
    $('#lbl').html(generateNum1 + ";" + generateNum2);
 })
});
</script></body></html>

Answer 2

您需要一个在一定范围内生成随机整数的函数。

function getRandomInt(min, max) {
  return Math.floor(Math.random() * (max - min + 1)) + min;
}

button.addEventListener('click', function() {
  var num1 = getRandomInt(1, 3);
  var num2 = getRandomInt(1, 3);

  alert(num1 === num2 ? 'Both numbers are the same' : 'Both numbers are different');
});

JSFiddle演示：https://jsfiddle.net/1rp5xvte/1/

随机生成数字并检查匹配数字

2 个答案: