验证输入是否为'；在javascript/jquery中不能正常工作
我基本上创建了这个游戏，根据用户输入的要显示的球数在屏幕上生成随机数的球，然后在右侧，他必须按顺序输入球数并单击验证，如果他正确，它会显示“正确”，否则会显示“对不起，正确的数字是”然后显示数字的实际顺序。问题是，每当我单击verify时，结果总是正确的，即使我没有输入任何数字，或者即使数字r错误。我犯了什么错误？下面是我的代码：我将在程序的验证部分旁边放置一个命令，以便您更容易找到问题验证输入是否为'；在javascript/jquery中不能正常工作,javascript,jquery,html,html5-canvas,Javascript,Jquery,Html,Html5 Canvas,我基本上创建了这个游戏，根据用户输入的要显示的球数在屏幕上生成随机数的球，然后在右侧，他必须按顺序输入球数并单击验证，如果他正确，它会显示“正确”，否则会显示“对不起，正确的数字是”然后显示数字的实际顺序。问题是，每当我单击verify时，结果总是正确的，即使我没有输入任何数字，或者即使数字r错误。我犯了什么错误？下面是我的代码：我将在程序的验证部分旁边放置一个命令，以便您更容易找到问题 <html> <head> </head> <script typ
<html>
<head>
</head>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" >
window.onload=draw;
var xArr=[];
var choose;
function draw(){
var canvas= document.getElementById("canvas");
var ctx=canvas.getContext("2d");
var id;
var x;
var y;
var r;
var i;
var balls=[{"id":1,"x":85,"y":90,"r":40},{"id":2,"x":180,"y":90,"r":40},{"id":3,"x":270,"y":90,"r":40},{"id":4,"x":360,"y":90,"r":40},
{"id":5,"x":450,"y":90,"r":40},{"id":6,"x":535,"y":90,"r":40},{"id":7,"x":623,"y":90,"r":40},{"id":8,"x":710,"y":90,"r":40},
{"id":9,"x":85,"y":190,"r":40},{"id":10,"x":180,"y":190,"r":40},{"id":11,"x":270,"y":190,"r":40},{"id":12,"x":360,"y":190,"r":40},
{"id":13,"x":450,"y":190,"r":40},{"id":14,"x":535,"y":190,"r":40},{"id":15,"x":623,"y":190,"r":40},{"id":16,"x":710,"y":190,"r":40},
{"id":17,"x":85,"y":290,"r":40},{"id":18,"x":180,"y":290,"r":40},{"id":19,"x":270,"y":290,"r":40},{"id":20,"x":360,"y":290,"r":40},
{"id":21,"x":450,"y":290,"r":40},{"id":22,"x":535,"y":290,"r":40},{"id":23,"x":623,"y":290,"r":40},{"id":24,"x":710,"y":290,"r":40},
{"id":25,"x":85,"y":390,"r":40},{"id":26,"x":180,"y":390,"r":40},{"id":27,"x":270,"y":390,"r":40},{"id":28,"x":360,"y":390,"r":40},
{"id":29,"x":450,"y":390,"r":40},{"id":30,"x":535,"y":390,"r":40},{"id":31,"x":623,"y":390,"r":40},{"id":32,"x":710,"y":390,"r":40},
{"id":33,"x":85,"y":490,"r":40},{"id":34,"x":180,"y":490,"r":40},{"id":35,"x":270,"y":490,"r":40},{"id":36,"x":360,"y":490,"r":40},
{"id":37,"x":450,"y":490,"r":40},{"id":38,"x":535,"y":490,"r":40},{"id":39,"x":623,"y":490,"r":40},{"id":40,"x":710,"y":490,"r":40},
{"id":41,"x":85,"y":590,"r":40},{"id":42,"x":180,"y":590,"r":40},{"id":43,"x":270,"y":590,"r":40},{"id":44,"x":360,"y":590,"r":40},
{"id":45,"x":450,"y":590,"r":40},{"id":46,"x":535,"y":590,"r":40},{"id":47,"x":623,"y":590,"r":40},{"id":48,"x":710,"y":590,"r":40},
{"id":49,"x":85,"y":690,"r":40},{"id":50,"x":85,"y":690,"r":40}];
var texts=[];
for(i=1;i<=balls.length;i++){
texts[i]=i;
}
var x=[];
var t=[];
var xstep=0;
choose=parseFloat(prompt("enter the number of balls u want to see"));
for (i=0; i<choose; i++) {
var b = getRandomBall();
x.push(b);
ctx.fillStyle = "#800000";
ctx.strokeStyle = "#000000";
ctx.beginPath();
xstep=xstep+120;
var ystep=90;
ctx.arc(xstep, ystep, 50, 0, 2 * Math.PI);
ctx.stroke();
ctx.fill();
ctx.fillStyle = 'black';
ctx.fillText(b.id, xstep, ystep);
console.log(i);
$(".selected").append('<label>Enter a number: </label><input type="text" name="userNumber'+i+'" id="userNumber'+i+'"><br /><br />');
}
function getRandomBall(){
var r = Math.floor(Math.random() * balls.length);
return balls.splice(r,1)[0];
}
xArr = x;
}
draw()
</script>
<body>
<div id="leftside" width="900" height="1000" style="border: 2px solid #000000">
<canvas id="canvas" width="800" height="800" style="border: 2px solid #000000">
</canvas>
<div id="rightside" width="300" height="800" style="border 2px solid #000000; float: right; margin-right:100px;">
<form action="#" method="get" >
<div class="selected"></div>
<input type="button" id="verifyBtn" value="verify">
<hr>
</form>
the result is:
<div id="result" style="font-size: 14px"></div>
</div>
</div>
</body>
<script type="text/javascript">
$(document).ready(function(){ //here is the issue
for (i=0; i<choose; i++) {
$("#verifyBtn").click(function(){
if(($('#userNumber'+i).val()==xArr[i])){
$("#result").css({color:'green'});
$("#result").text("correct");
}
else{
$("#result").css({color:'red'});
$("#result").text("sorry: try again"+ " correct number was "+xArr);
}
})
}
})
</script>
</html>
window.onload=draw；
var xArr=[]；
var选择；
函数绘图（）{
var canvas=document.getElementById（“canvas”）；
var ctx=canvas.getContext（“2d”）；
变量id；
var x；
变量y；
var-r；
var i；
var balls=[{id:1,x:85,y:90,r:40}，{id:2,x:180,y:90,r:40}，{id:3,x:270,y:90,r:40}，{id:4,x:360,y:90,r:40}，
{“id”：5，“x”：450，“y”：90，“r”：40}，{“id”：6，“x”：535，“y”：90，“r”：40}，{“id”：7，“x”：623，“y”：90，“r”：40}，{“id”：8，“x”：710，“y”：90，“r”：40}，
{“id”：9，“x”：85，“y”：190，“r”：40}，{“id”：10，“x”：180，“y”：190，“r”：40}，{“id”：11，“x”：270，“y”：190，“r”：40}，{“id”：12，“x”：360，“y”：190，“r”：40}，
{“id”：13，“x”：450，“y”：190，“r”：40}，{“id”：14，“x”：535，“y”：190，“r”：40}，{“id”：15，“x”：623，“y”：190，“r”：40}，{“id”：16，“x”：710，“y”：190，“r”：40}，
{“id”：17，“x”：85，“y”：290，“r”：40}，{“id”：18，“x”：180，“y”：290，“r”：40}，{“id”：19，“x”：270，“y”：290，“r”：40}，{“id”：20，“x”：360，“y”：290，“r”：40}，
{“id”：21，“x”：450，“y”：290，“r”：40}，{“id”：22，“x”：535，“y”：290，“r”：40}，{“id”：23，“x”：623，“y”：290，“r”：40}，{“id”：24，“x”：710，“y”：290，“r”：40}，
{“id”：25，“x”：85，“y”：390，“r”：40}，{“id”：26，“x”：180，“y”：390，“r”：40}，{“id”：27，“x”：270，“y”：390，“r”：40}，{“id”：28，“x”：360，“y”：390，“r”：40}，
{“id”：29，“x”：450，“y”：390，“r”：40}，{“id”：30，“x”：535，“y”：390，“r”：40}，{“id”：31，“x”：623，“y”：390，“r”：40}，{“id”：32，“x”：710，“y”：390，“r”：40}，
{“id”：33，“x”：85，“y”：490，“r”：40}，{“id”：34，“x”：180，“y”：490，“r”：40}，{“id”：35，“x”：270，“y”：490，“r”：40}，{“id”：36，“x”：360，“y”：490，“r”：40}，
{“id”：37，“x”：450，“y”：490，“r”：40}，{“id”：38，“x”：535，“y”：490，“r”：40}，{“id”：39，“x”：623，“y”：490，“r”：40}，{“id”：40，“x”：710，“y”：490，“r”：40}，
{“id”：41，“x”：85，“y”：590，“r”：40}，{“id”：42，“x”：180，“y”：590，“r”：40}，{“id”：43，“x”：270，“y”：590，“r”：40}，{“id”：44，“x”：360，“y”：590，“r”：40}，
{“id”：45，“x”：450，“y”：590，“r”：40}，{“id”：46，“x”：535，“y”：590，“r”：40}，{“id”：47，“x”：623，“y”：590，“r”：40}，{“id”：48，“x”：710，“y”：590，“r”：40}，
{“id”：49，“x”：85，“y”：690，“r”：40}，{“id”：50，“x”：85，“y”：690，“r”：40}；
var文本=[]；
对于（i=1；i开始时不将事件处理程序放在一个循环中，该循环对每个球进行迭代，然后我将它放在哪里？我尝试了它，但它不起作用。我认为验证部分有一个问题，首先不将事件处理程序放在一个循环中，该循环对每个球进行迭代，然后我将它放在哪里？我尝试了它，但它不起作用。问题是我认为是验证部分