不废话  先上代码<script type="text/javascript">
alert('点击一下:方块变红,为默认雷区。点击两下:显示数字或雷点!!');
var tm=0,fm=0;
function $(x){return(document.getElementById(x));}
function st()
{
var show=$("show");
for(x=1;x<11;x++)
{
for(y=1;y<11;y++)
{
var nd=document.createElement("div");
nd.className="A-1";
nd.X=x;
nd.Y=y;
nd.id=String(x)+y;
rnd=Math.ceil(Math.random()*4);
if(rnd==1)
{
nd.w="*";
tm++;
}
else
{
nd.w=0;
fm++;
}
nd.status=0;
nd.innerHTML="<a href='#' onClick='loc(this)'></a>";
show.appendChild(nd);
}
}
}
function loc(obj)
{
var js=0;
if(obj.parentNode.status==0)
{
obj.style.background="#FF0000";
obj.parentNode.status=1;
}
else if(obj.parentNode.status==1)
{
obj.parentNode.status=2
obj.style.background="#CCCCCC";
if(obj.parentNode.w=="*")
{
alert('您踩中雷区了,失败啊!');
obj.innerHTML=obj.parentNode.w;
}
else
{
x=obj.parentNode.X;
y=obj.parentNode.Y;
if(x==1)
{
if(y==1)
{
if($("12").w=="*")
js++;
if($("21").w=="*")
js++;
if($("21").w=="*")
js++;
}
else if(y==10)
{
if($("19").w=="*")
js++;
if($("29").w=="*")
js++;
if($("210").w=="*")
js++;
}
else
{
if($("1"+(y-1)).w=="*")
js++;
if($("1"+(y+1)).w=="*")
js++;
if($("2"+(y-1)).w=="*")
js++;
if($("2"+y).w=="*")
js++;
if($("2"+(y+1)).w=="*")
js++;
}
}
else if(x==10)
{
if(y==1)
{
if($("102").w=="*")
js++;
if($("91").w=="*")
js++;
if($("92").w=="*")
js++;
}
else if(y==10)
{
if($("99").w=="*")
js++;
if($("910").w=="*")
js++;
if($("109").w=="*")
js++;
}
else
{
if($("10"+(y-1)).w=="*")
js++;
if($("10"+(y+1)).w=="*")
js++;
if($("9"+(y-1)).w=="*")
js++;
if($("9"+y).w=="*")
js++;
if($("9"+(y+1)).w=="*")
js++;
}
}
else
{
if(y==1)
{
if($((x-1)+"1").w=="*")
js++;
if($((x+1)+"1").w=="*")
js++;
if($((x-1)+"2").w=="*")
js++;
if($(x+"2").w=="*")
js++;
if($((x+1)+"2").w=="*")
js++;
}
else if(y==10)
{
if($((x-1)+"10").w=="*")
js++;
if($((x+1)+"10").w=="*")
js++;
if($((x-1)+"9").w=="*")
js++;
if($(x+"9").w=="*")
js++;
if($((x+1)+"9").w=="*")
js++;
}
else
{
if($(String(x-1)+(y-1)).w=="*")
js++;
if($(String(x-1)+y).w=="*")
js++;
if($(String(x-1)+(y+1)).w=="*")
js++;
if($(String(x)+(y-1)).w=="*")
js++;
if($(String(x)+(y+1)).w=="*")
js++;
if($(String(x+1)+(y-1)).w=="*")
js++;
if($(String(x+1)+y).w=="*")
js++;
if($(String(x+1)+(y+1)).w=="*")
js++;
}
}
obj.innerHTML=js;
}
}
else
{
alert('抱歉,翻开的牌面不允许再次翻开!');
}
}
</script>
<style>
.A-1 a{
width:10%;
height:13px;
padding:20px;
display:inline;
float:left;
border-bottom:#666666 3px solid;
border-right:#666666 3px solid;
border-left:3px #FFFFFF solid;
border-top:3px #FFFFFF solid;
background-color:#CCCCCC;
color:#000000;
font-family:"黑体";
font-size:13px;
}
.A-1 a:hover{
width:10%;
height:13px;
padding:20px;
display:inline;
float:left;
color:#000000;
font-family:"黑体";
font-size:13px;
border-bottom:#FFFFFF 3px solid;
border-right:#FFFFFF 3px solid;
border-left:3px #666666 solid;
border-top:3px #666666 solid;
}
</style>
<body bgcolor="#669900" onLoad="st()">
<div style="margin:0 auto; width:600px;">
<div id="show" style="width:615px; height:590px; float:left;border:2px #000000 solid; display:inline;"></div>
</div>
</body>这个是针对IE的 火狐效果很稀烂
小弟的问题是 
如何实现类似windows扫雷那种  点击一个周围不为雷的点会展开
本来想的是  用循环判断做
不过会无限递推了 对吧
难道要配合随即函数?
高手  指点个思路啊 

解决方案 »

  1.   

    这个思路看看行不?
    点击一个周围不为雷的格子,判断周围4个格子是否已被打开,
    如果其中有未打开的格子,执行这个格子的点击事件。
      

  2.   

    这个思路看看行不?
    点击一个周围不为雷的格子,判断周围4个格子是否已被打开,
    如果其中有未打开的格子,执行这个格子的点击事件。
    ----------------------------
    确实  是可行的 
    不过貌似无法实现 摊开一片区域的情况
    之前想说  递推应该可以的  用循环判断 再调用点击事件我还是先把这个加上去  试试 先谢了哈