表格加图片(7)
<!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>无标题文档</title>
<script type="text/javascript">
var syArray=new Array();
var row=3,col=4;
var currImgNO=-1;
var lastImgno=-1;
var isUser=new Array();
function sySort()
{
return Math.random()>.5;
}
function init(row,col)
{
currImgNo=lastImgNo=-1;
var n=(row*col)/2;
for(var k=1;k<=(2*n);k++)
{
isUser[k]=false;
}
for(var k=1;k<=n;k++)
{
syArray[k]= parseInt( Math.random() *18);
syArray[(k+n)]=syArray[k];
}
syArray.sort(sySort);
var str='<table border="1" width="300" height="300">';
for(var i=0;i<row;i++)
{
str +="<tr>";
for(var j=1;j<=col;j++)
{
str +="<td onclick='judge("+ ((i)*col+j) +");'>"
str+='<img id="img_'+((i)*col+j)+'" src="photo/image0.gif"/>'
str+="</td>";
}
str +="</tr>";
}
str+='</table>';
document.getElementById("lsy").innerHTML=str;
}
function onRe()
{
init(row,col);
row++;//var row=document.getElementById("t1").value;
col++;//var col=document.getElementById("t2").value;
document.getElementById("next").value="下一关";
}
function judge(temp)
{
if(isUser[temp]) return;
isUser[temp]=true;
lastImgNo=currImgNo;
currImgNo=temp; //alert(temp);
var currImg=document.getElementById("img_"+temp);
currImg.src="photo/image"+syArray[temp]+".gif";
if(lastImgNo>=0)
{
if(syArray[currImgNo]==syArray[lastImgNo])
{
alert("成功");
currImgNo=lastImgNo=-1;
}
else
{
var lastImg=document.getElementById("img_"+lastImgNo);
lastImg.src="photo/image0.gif";
isUser[lastImgNo]=false;
}
}
}
</script>
</head>
<body>
<html>
<body>
<div id="lsy"> bg</div>
<input type="text" size="10" id="t1" />
<input type="text" size="11" id="t2" />
<input id="next"type="button" width="10" value="开始" onclick="onRe();" />
</body>
<body>
<h4>表头:</h4>
<table width="200" border="1">
<tr>
<td onclick="test();" align="center">1</td>
<td align="center">2</td>
<td align="center">3</td>
</tr>
<tr>
<td align="center">4</td>
<td align="center">5</td>
<td align="center">6</td>
</tr>
<tr>
<td align="center">7</td>
<td align="center">8</td>
<td align="center">9</td>
</tr>
</table>
</body>
</html>
</body>
</html>