代码其实很简单，这里就不多废话了
<html>
<head>
<meta http-equiv="Content-Language" content="zh-cn">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>扫雷-JavaScript Mine Sweeper</title>
<style type="text/css">
table{TABLE-LAYOUT: fixed;cursor:pointer}
td{width: 20px; height: 20px; font-size: 12px; font-family: Verdana;font-weight:bold; text-align:center;background:#CECECE;}
td.Normal, .Flag{border-left:2px solid #F5F5F5; border-right:2px outset #F5F5F5; border-top:2px solid #F5F5F5; border-bottom:2px outset #F5F5F5; font-weight:bold}
.Mine, .Boom, .M0, .M1, .M2, .M3, .M4, .M5, .M6, .M7, .M8{background:#C5C5C5;border-right:1px solid #B4B4B4; border-bottom:1px solid #B4B4B4;}
td.Mine{background: url(http://sandbox.runjs.cn/uploads/rs/202/xyovf5xj/mine.gif) no-repeat center}
td.Boom{background:#F00 url(http://sandbox.runjs.cn/uploads/rs/202/xyovf5xj/mine.gif) no-repeat center}
td.Flag, td.ErrFlag{background-image: url(http://sandbox.runjs.cn/uploads/rs/202/xyovf5xj/flag.gif);background-repeat: no-repeat; background-position: center;}
td.ErrFlag{background:#0F0}
td.M1 {color: #00f}
td.M2 {color: #008000}
td.M3 {color: #f00}
td.M4 {color: #000080}
td.M5 {color: #800000}
td.M6 {color: #008080}
td.M7 {color: #000}
td.M8 {color: #808080}
</style>
<script>
var $=function(id){return document.getElementById(id)},
MouseButton=LeftMouse=0,//作为双键单击的计数，mouseup事件置0，mousedown事件＋1，当MouseButton=2说明双键同时单击;鼠标左键是否按下，当鼠标左键按下时为1，松开为0
FlagImg=new Image(),
HappyImg=new Image(),
MineImg=new Image(),
SadImg=new Image(),
SuccessImg=new Image(),
WhichButton=function(e){
e=e||window.event;
var b=getOs();
if(b!=2){ //非FF
switch(e.button){
case 2:
return 0;
case 0:
return b==1"#000000" border="0" cellpadding="0" cellspacing="0" height="'+20*MaxY+'px" width="'+20*MaxX+'px" style="border: 10px inset #a0a0a0">'],
i=0,TAr,TMine=T.Mine;
T.MaxOpenCount=MaxX*MaxY-MineCount;
while(nY--){
AStr[++i]='<tr>';
TAr=TMine[nY]=[];
nX=MaxX;
while(nX--){
AStr[++i]='<td class="Normal" onmousedown="OMine.fMouseDown('+nX+','+nY+',event);" onmouseup="OMine.fMouseUp('+nX+','+nY+',event);" onmouseover="OMine.fButtonMouseOver('+nX+','+nY+')" onmouseout="OMine.fButtonMouseOut('+nX+','+nY+')" id="Img'+nX+'_'+nY+'"> </td>';
TAr[nX]={
Mine:0, //0表示没有雷,1表示有雷
State:0,//0表示未开启,1表示左键开启,2表示右键标记
MineCount:0//周围有几个雷
}
}
AStr[++i]='</tr>';
}
AStr[++i]='</table>';
$('dMap').innerHTML=T.InitStr=AStr.join('');
$('txtFlagCount').value=MineCount;
T.fInitMine();
$('btnRefreshMap').src='http://sandbox.runjs.cn/uploads/rs/202/xyovf5xj/happy.gif';
T.GameOver=T.Success=false;
T.OpenedCount=T.FlagCount=T.aClear.lenght=0;
},
//为了方便循环赋值,给表格数组赋值的时候是XY倒过来循环的,所以调用的时候要倒回去
//比如要获得该格子是否有雷,用OMine.fGetMine(x,y).Mine;
fGetMine:function(X,Y){return this.Mine[Y][X]},
//仅当按重新开始的按钮，不初始化大表格字符
fRefreshMap:function(){
var T=this;
$('dMap').innerHTML=T.InitStr;
T.fResetOMine();//必须先重置OMine,再重置99个雷
T.fInitMine();
T.GameOver=T.Success=false;
$('btnRefreshMap').src='http://sandbox.runjs.cn/uploads/rs/202/xyovf5xj/happy.gif';
$('txtFlagCount').value=T.MineCount;
T.OpenedCount=T.FlagCount=T.aClear.lenght=0;
},
//重置OMine.Mine数组
fResetOMine:function(){
var T=this,MaxY=T.MaxY,MaxX=T.MaxX,X,Y=MaxY,M,Mine=T.Mine,TAr;
while(Y--){
X=MaxX;
TAr=Mine[Y];
while(X--)(M=TAr[X]).Mine=M.State=M.MineCount=0;
}
},
//初始化雷的数组
fInitMine:function(){
var T=this,MaxX=T.MaxX,MaxY=T.MaxY,a,fGetMine=T.fGetMine,
aOld=[],x,y=MaxY,n=0,l=T.MineCount,xRand; //一个随机数字
while(y--){
x=MaxX;
while(x--)aOld[n++]=[x,y];
}
while(l--){
a=aOld[xRand=Math.floor(Math.random()*(n-1))];
T.fGetMine(a[0],a[1]).Mine=1;
aOld.splice(xRand,1);
--n;
}
},
//鼠标移动到某格子的时候
fButtonMouseOver:function(X,Y){
var T=this;
switch(MouseButton){
case 2://双键按下的状态
var arr=T.fGetAround(X,Y),i=arr.length,TAr;
while(i--)T.fButtonDown((TAr=arr[i])[0],TAr[1]);
case 1:
LeftMouse==1&&T.fButtonDown(X,Y); //左键是按下的
}
},
//鼠标移出某格子的时候
fButtonMouseOut:function(X,Y){
var T=this;
switch(MouseButton){
case 2://双键按下的状态
var arr=T.fGetAround(X,Y),i=arr.length,TAr;
while(i--)T.fButtonUp((TAr=arr[i])[0],TAr[1]);
case 1:
LeftMouse==1&&T.fButtonUp(X,Y); //左键是按下的
}
},
//鼠标按下时没被开启的格子呈现被按下
fButtonDown:function(X,Y){
var srcEle=$('Img'+X+'_'+Y);
srcEle.className=='Normal'&&(srcEle.className='M0');
},
//让没被开启并且已经呈现被按下的格子回复Normal
fButtonUp:function(X,Y){
var srcEle=$('Img'+X+'_'+Y);
srcEle.className=='M0'&&!this.fGetMine(X,Y).State&&(srcEle.className='Normal');
},
//获取8个方向的坐标
fGetAround:function(X,Y){
var TX,TY,i=8,MX=this.MaxX-1,MY=this.MaxY-1,
Arr=[[-1,0],[-1,-1],[0,-1],[1,-1],[1,0],[1,1],[0,1],[-1,1]],
newArr=[],TAr;
while(i--){
TX=X+(TAr=Arr[i])[0];
TY=Y+TAr[1];
!(TX<0||TX>MX||TY<0||TY>MY)&&newArr.push([TX,TY]);
}
return newArr;
},
//鼠标在格子按下
fMouseDown:function(X,Y,evt){
var T=this;
if(T.GameOver){
alert('游戏失败,再接再厉!');
return;
}
if(T.Success){
alert('恭喜游戏成功!再来一局吧？');
return;
}
var srcEle=$('Img'+X+'_'+Y),ObXY=T.fGetMine(X,Y),arr,i,TAr;
++MouseButton;
evt=evt||window.event;
switch(MouseButton){
case 2:
arr=T.fGetAround(X,Y);i=arr.length;
while(i--)T.fButtonDown((TAr=arr[i])[0],TAr[1]);
break;
case 1:
if(WhichButton(evt)){
LeftMouse=1;
T.fButtonDown(X,Y);
}else{
switch(ObXY.State){
case 0:
ObXY.State=2;
srcEle.className='Flag';
--$('txtFlagCount').value;
++T.FlagCount;
break;
case 2:
ObXY.State=0;
srcEle.className='Normal';
++$('txtFlagCount').value;
--T.FlagCount;
}
}
}
},
//鼠标在格子弹起
fMouseUp:function(X,Y,evt){
var T=this;
evt=evt||window.event;
var srcEle=$('Img'+X+'_'+Y),ObXY=T.fGetMine(X,Y),arr,i,TAr;
switch(MouseButton){
case 2: //MouseDown为两个键都单击按下，任意一个键弹起都判断为双键弹起
LeftMouse=0;
//鼠标弹起，把呈现被按下状态的格子恢复
arr=T.fGetAround(X,Y);i=arr.length;
while(i--)T.fButtonUp((TAr=arr[i])[0],TAr[1]);
!ObXY.State&&T.fButtonUp(X,Y);
ObXY.State==1&&ObXY.MineCount&&T.fOpenFlagMine(X,Y);
break;
case 1: //当MouseDown为一个键单击时，MouseUp才判断为一个键弹起
if(WhichButton(evt)){
//只有在State=0才起作用,跟是否有雷没关系
LeftMouse=0;
if(ObXY.State){break;}
ObXY.Mine"MSIE")>0)return 1;
if(isFirefox=navigator.userAgent.indexOf("Firefox")>0)return 2;
if(isSafari=navigator.userAgent.indexOf("Safari")>0)return 3;
if(isCamino=navigator.userAgent.indexOf("Camino")>0)return 4;
if(isMozilla=navigator.userAgent.indexOf("Gecko/")>0)return 5;
return 0;
};
FlagImg.src='http://sandbox.runjs.cn/uploads/rs/202/xyovf5xj/flag.gif';
HappyImg.src='http://sandbox.runjs.cn/uploads/rs/202/xyovf5xj/happy.gif';
MineImg.src='http://sandbox.runjs.cn/uploads/rs/202/xyovf5xj/mine.gif';
SadImg.src='http://sandbox.runjs.cn/uploads/rs/202/xyovf5xj/sad.gif';
SuccessImg.src='http://sandbox.runjs.cn/uploads/rs/202/xyovf5xj/success.gif';
</script>
</head>
<body topmargin="0" oncontextmenu="return false" ondragstart="return false" onselectstart="return false" onload="OMine.fInit()" bgcolor="#808080">
<center>
<div id="dTop" align="center" style="border-style: inset; border-width: 10;width:400">
<table cellpadding="0" cellspacing="0" style="border-collapse: collapse;" width="380" height="44">
<tr>
<td style="width: 102; height:50px">
<input type="text" id="txtFlagCount" size="20" style="width: 60; height: 30; color:#FF0000; text-align:center; font-family:Verdana; font-weight:bold; background-color:#000000; font-size:13pt" value=""></td>
<td style="width: 136; height:50px">
<input onclick="OMine.fRefreshMap()" type="image" id="btnRefreshMap" src="/UploadFiles/2021-04-02/happy.gif">
以上所述就是本文的全部内容了，希望大家能够喜欢。
免责声明：本站文章均来自网站采集或用户投稿，网站不提供任何软件下载或自行开发的软件！
如有用户或公司发现本站内容信息存在侵权行为，请邮件告知！ 858582#qq.com
暂无“JavaScript制作windows经典扫雷小游戏”评论...
《魔兽世界》大逃杀！60人新游玩模式《强袭风暴》3月21日上线
暴雪近日发布了《魔兽世界》10.2.6 更新内容，新游玩模式《强袭风暴》即将于3月21 日在亚服上线，届时玩家将前往阿拉希高地展开一场 60 人大逃杀对战。
艾泽拉斯的冒险者已经征服了艾泽拉斯的大地及遥远的彼岸。他们在对抗世界上最致命的敌人时展现出过人的手腕，并且成功阻止终结宇宙等级的威胁。当他们在为即将于《魔兽世界》资料片《地心之战》中来袭的萨拉塔斯势力做战斗准备时，他们还需要在熟悉的阿拉希高地面对一个全新的敌人──那就是彼此。在《巨龙崛起》10.2.6 更新的《强袭风暴》中，玩家将会进入一个全新的海盗主题大逃杀式限时活动，其中包含极高的风险和史诗级的奖励。
《强袭风暴》不是普通的战场，作为一个独立于主游戏之外的活动，玩家可以用大逃杀的风格来体验《魔兽世界》，不分职业、不分装备（除了你在赛局中捡到的），光是技巧和战略的强弱之分就能决定出谁才是能坚持到最后的赢家。本次活动将会开放单人和双人模式，玩家在加入海盗主题的预赛大厅区域前，可以从强袭风暴角色画面新增好友。游玩游戏将可以累计名望轨迹，《巨龙崛起》和《魔兽世界：巫妖王之怒 经典版》的玩家都可以获得奖励。
更新动态
2025年11月02日
2025年11月02日
- 小骆驼-《草原狼2(蓝光CD)》[原抓WAV+CUE]
- 群星《欢迎来到我身边 电影原声专辑》[320K/MP3][105.02MB]
- 群星《欢迎来到我身边 电影原声专辑》[FLAC/分轨][480.9MB]
- 雷婷《梦里蓝天HQⅡ》 2023头版限量编号低速原抓[WAV+CUE][463M]
- 群星《2024好听新歌42》AI调整音效【WAV分轨】
- 王思雨-《思念陪着鸿雁飞》WAV
- 王思雨《喜马拉雅HQ》头版限量编号[WAV+CUE]
- 李健《无时无刻》[WAV+CUE][590M]
- 陈奕迅《酝酿》[WAV分轨][502M]
- 卓依婷《化蝶》2CD[WAV+CUE][1.1G]
- 群星《吉他王(黑胶CD)》[WAV+CUE]
- 齐秦《穿乐(穿越)》[WAV+CUE]
- 发烧珍品《数位CD音响测试-动向效果（九）》【WAV+CUE】
- 邝美云《邝美云精装歌集》[DSF][1.6G]
- 吕方《爱一回伤一回》[WAV+CUE][454M]