我正在一个动态的宾果游戏，随机生成每个宾果广场的数字，当你点击一个正方形它会改变颜色。我已经完成了。我创建了一个表，并且每个TD I内有以下代码：Javascript设置变量与onclick
<td onclick="javascript:this.style.background = '#00ff00';"
id="B1" class="bingo1"><script>document.write(patty[0]);</script></td>
当页面被加载的每个正方形（TD）将具有被初始设置为0的变量（VAR B1 = 0;）。当你点击广场的变量增加到1，但我不知道如何做到这一点。我认为这可能是通过onclick事件完成的，也可能是在背景颜色改变时检测到。但是，正如我所说，我不知道如何去做这些。任何和所有的帮助将不胜感激。谢谢！
保重，有一个伟大的日子....
ciao， john。
我也只是有一个二维阵列，（5×5）全部设为零（一边的自由空间，它被设置为1），然后将单独的细胞是按钮一些阵列值更改为1
像这样：
<!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>Bingo</title>
<style>
#card {width:510px; margin-right:auto; margin-left:auto; position:relative; }
.top {border: thin #000 solid; float:left; width:100px; height:20px; text-align:center;}
.cell {border: thin #000 solid; float:left; width:100px; height:60px;text-align:center;padding-top:40px;}
.on {border: thin #000 solid; float:left; width:100px; height:60px; background-color:#0F0;text-align:center;padding-top:40px;}
.win {border: thin #000 solid; float:left; width:100px; height:60px; background-color:#F00;text-align:center;padding-top:40px;}
</style>
</head>
<body>
<div id="card"><div class="top">B</div><div class="top">I</div><div class="top">N</div><div class="top">G</div><div class="top">O</div></div>
</body>
<script type="text/javascript">
var score=new Array();
var existingNumbers=new Array();
var r,c;
for(r=0;r<5;r++){
for(c=0;c<5;c++){
score[r]=Array();
score[r][c]=0;
if((c==2)&&(r==2)){
score[r][c]=1;
document.getElementById('card').innerHTML+='<div id="cell'+r+c+'" class="on">FREE</div>';
}
else{
document.getElementById('card').innerHTML+='<div id="cell'+r+c+'" class="cell" onclick="tap('+r+','+c+');">'+number(c)+'</div>';
}
}
document.body.innerHTML+='<br/>';
}
function number(col){
var num=Math.ceil(Math.random()*15)+(15*col);
while(existingNumbers.indexOf(num)!=-1){
num=Math.ceil(Math.random()*15)+(15*col);
}
existingNumbers.push(num);
return num;
}
function tap(r,c){
document.getElementById('cell'+r+c).className="on";
score[r][c]=1;
winTest();
}
function winTest(){
//there has got to be a more concise way of doing this, but right now it's just for function
var winner=false;
r1=score[0][0]+score[1][0]+score[2][0]+score[3][0]+score[4][0];
r2=score[0][1]+score[1][1]+score[2][1]+score[3][1]+score[4][1];
r3=score[0][2]+score[1][2]+1+score[3][2]+score[4][2];
r4=score[0][3]+score[1][3]+score[2][3]+score[3][3]+score[4][3];
r5=score[0][4]+score[1][4]+score[2][4]+score[3][4]+score[4][4];
c1=score[0][0]+score[0][1]+score[0][2]+score[0][3]+score[0][4];
c2=score[1][0]+score[1][1]+score[1][2]+score[1][3]+score[1][4];
c3=score[2][0]+score[2][1]+1+score[2][3]+score[2][4];
c4=score[3][0]+score[3][1]+score[3][2]+score[3][3]+score[3][4];
c5=score[4][0]+score[4][1]+score[4][2]+score[4][3]+score[4][4];
d1=score[0][0]+score[1][1]+1+score[3][3]+score[4][4];
d2=score[0][4]+score[1][3]+1+score[3][1]+score[4][0];
if(r1==5){
document.getElementById('cell00').className="win";
document.getElementById('cell10').className="win";
document.getElementById('cell20').className="win";
document.getElementById('cell30').className="win";
document.getElementById('cell40').className="win";
winner=true;
}
if(r2==5){
document.getElementById('cell01').className="win";
document.getElementById('cell11').className="win";
document.getElementById('cell21').className="win";
document.getElementById('cell31').className="win";
document.getElementById('cell41').className="win";
winner=true;
}
if(r3==5){
document.getElementById('cell02').className="win";
document.getElementById('cell12').className="win";
document.getElementById('cell22').className="win";
document.getElementById('cell32').className="win";
document.getElementById('cell42').className="win";
winner=true;
}
if(r4==5){
document.getElementById('cell03').className="win";
document.getElementById('cell13').className="win";
document.getElementById('cell23').className="win";
document.getElementById('cell33').className="win";
document.getElementById('cell43').className="win";
winner=true;
}
if(r5==5){
document.getElementById('cell04').className="win";
document.getElementById('cell14').className="win";
document.getElementById('cell24').className="win";
document.getElementById('cell34').className="win";
document.getElementById('cell44').className="win";
winner=true;
}
if(c1==5){
document.getElementById('cell00').className="win";
document.getElementById('cell01').className="win";
document.getElementById('cell02').className="win";
document.getElementById('cell03').className="win";
document.getElementById('cell04').className="win";
winner=true;
}
if(c2==5){
document.getElementById('cell10').className="win";
document.getElementById('cell11').className="win";
document.getElementById('cell12').className="win";
document.getElementById('cell13').className="win";
document.getElementById('cell14').className="win";
winner=true;
}
if(c3==5){
document.getElementById('cell20').className="win";
document.getElementById('cell21').className="win";
document.getElementById('cell22').className="win";
document.getElementById('cell23').className="win";
document.getElementById('cell24').className="win";
winner=true;
}
if(c4==5){
document.getElementById('cell30').className="win";
document.getElementById('cell31').className="win";
document.getElementById('cell32').className="win";
document.getElementById('cell33').className="win";
document.getElementById('cell34').className="win";
winner=true;
}
if(c5==5){
document.getElementById('cell40').className="win";
document.getElementById('cell41').className="win";
document.getElementById('cell42').className="win";
document.getElementById('cell43').className="win";
document.getElementById('cell44').className="win";
winner=true;
}
if(d1==5){
document.getElementById('cell00').className="win";
document.getElementById('cell11').className="win";
document.getElementById('cell22').className="win";
document.getElementById('cell33').className="win";
document.getElementById('cell44').className="win";
winner=true;
}
if(d2==5){
document.getElementById('cell04').className="win";
document.getElementById('cell13').className="win";
document.getElementById('cell22').className="win";
document.getElementById('cell31').className="win";
document.getElementById('cell40').className="win";
winner=true;
}
if(winner){
alert('You WIN!!');
}
}
</script>
</html>
要改变，你可以使用id：
<td onclick="javascript:this.style.background = '#00ff00';this.id = 'newId';"
id="B1" class="bingo1"><script>document.write(patty[0]);</script></td>
是，这是你后？如果不是，你可以编辑你的问题，以便更直接。
对不起。对于每个正方形，我想要一个最初设置为0的变量（var B1 = 0;）。当你点击正方形时，变量增加+1。 – Mock26 2012-03-24 01:55:50
你能也许给一个侧面由端的点击之前和之后点击'id's？你真的应该离开在线JavaScript，分离你的模型和行为（如果仅仅为了将来的可维护性）。 – 2012-03-23 23:40:20
他的id是指DOM元素。 *你的意思是“分配一个初始值......”*它是什么意思？ – Hamish 2012-03-24 00:00:27
你想改变html id或其他东西 – Starx 2012-03-24 20:42:55