不成熟打地鼠游戏 

<!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=gb2312" />
<style type="text/css">
<!--
td{width:100px;height:100px; }
-->
</style>
<title>打地鼠</title>
<script language="javascript">
var td = new Array();
var playing = false;    
var score = 0;
var beat = 0;
var timeLength = 10; 

function GameOver()//游戏结束函数
{
    timeStop();
    playing = false;
    clearMouse();
    alert("end！\nyour score："+score);
}    
function timeShow()
{
    document.form1.remtime.value = timeLength;
    if(timeLength == 0)
        {
            GameOver();
            return;
        }
    else
        {
            timeLength = timeLength-1;
            timeID = setTimeout("timeShow()",1000);//函数的调用，每隔一段时间调用一次
        }
}

function timeStop()
{
    clearInterval(t);
}
    
function show()
{
    if(playing)
    {
        var current = Math.floor(Math.random()*12);//随机产生老鼠图片
        document.getElementById("td["+current+"]").innerHTML = '<img src="02.gif">';
        setTimeout("document.getElementById('td["+current+"]').innerHTML=''",1000);//每隔一段时间随机调用函数
    }
}
function clearMouse()
{
    for(var i=0;i<=11;i++)
    {
        document.getElementById("td["+i+"]").innerHTML="";
    }
}

function hit(id)
{
    if(playing==false)
    {
        alert("亲，你错啦！哈哈！");
        return;
    }
    else
    {    
         beat +=1;
        if(document.getElementById("td["+id+"]").innerHTML!="")
        {
            score += 1;
            document.form1.score.value = score;
            document.getElementById("td["+id+"]").innerHTML="";
        }
        else
        {
            score += -1;
            document.form1.score.value = score;
        }
    }
}

function GameStart()//游戏开始函数
{
    playing=true;
    t=setInterval("show()",600);//老鼠停留时间
    document.form1.score.value = score;
    timeShow();
}
</script>
</head>
<body onload="alert(" Event demo loaded");" onunload="alert("Leaving demo");">
<hl align="center">HTML  事见绑定</hl>
<form action="#" method="get" onreset="alert('Form reset');" onsubmit="alert('Form submit');return false;">
<center>
<div id="Layer1">
  <marquee  direction="left">
  <table width="50" border="0" cellspacing="0" cellpadding="0" background="#000000">
    <tr>
      <td><img src="02.gif"  width="50"/></td>
      <td><img src="02.gif"  width="50"/></td>
      <td><img src="02.gif"  width="50"/></td>
    </tr>
  </table>
  </marquee>
</div>
<table border="1">
  <tr>
    <td id="td[0]" onclick="hit(0)"height="100" width="100" bgcolor="#006600"></td>
    <td id="td[1]" onclick="hit(1)"height="100" width="100" bgcolor="#006666"></td>
    <td id="td[2]" onclick="hit(2)"height="100" width="100" bgcolor="#006666"></td>
    <td id="td[3]" onclick="hit(3)"height="100" width="100" bgcolor="#006600"></td>
  </tr>
  <tr>
    <td id="td[4]" onclick="hit(4)"height="100" width="100" bgcolor="#006666"></td>
    <td id="td[5]" onclick="hit(5)"height="100" width="100" bgcolor="#006600"></td>
    <td id="td[6]" onclick="hit(6)"height="100" width="100" bgcolor="#006600"></td>
    <td id="td[7]" onclick="hit(7)"height="100" width="100" bgcolor="#006666"></td>
  </tr>
    <tr>
    <td id="td[8]" onclick="hit(8)"height="100" width="100" bgcolor="#006600"></td>
    <td id="td[9]" onclick="hit(9)"height="100" width="100" bgcolor="#006666"></td>
    <td id="td[10]" onclick="hit(10)"height="100" width="100" bgcolor="#006666"></td>
    <td id="td[11]" onclick="hit(11)"height="100" width="100" bgcolor="#006600"></td>
  </tr>
</table>
<input type="button" value="start" onclick="GameStart()">
<input type="button" value="end!" name="button" onclick="GameOver()"/>
<form name="form1">
<td>score</td>
<input type="text" name="score" size="10">
<td>Countdown</td>
<input type="text" name="remtime" size="10">
</form>
</center>
</form>
</body>
</html>
posted @ 2012-10-12 17:30  西科程序  阅读(212)  评论(0)  编辑  收藏  举报