1 <!DOCTYPE html>
2
3 <html lang=
"en" xmlns=
"http://www.w3.org/1999/xhtml">
4 <head>
5 <meta charset=
"utf-8" />
6 <style type=
"text/css">
7 td {
8 border:1px solid red;
9 color:white;
10 }
11 </style>
12 </head>
13 <body>
14 <script type=
"text/javascript">
15 var bones = {};
//存放所有的地雷
16 var rowNumber =
10,
//格子的行数
17 lineNumber =
10;
//格子的列数
18 var boneNumber =
9;
//地雷数量
19 var showCount =
0;
20 ///会根据每行与每列所有的格子数来确定雷在什么位置
21 ///每次只会创建一个雷
22 function createBone () {
23 var rowNo = parseInt(Math.random(
new Date().getTime()) *
rowNumber);
24 var lineNo = parseInt(Math.random(
new Date().getTime()) *
lineNumber);
25 var tempNo = rowNo *
1000 +
lineNo;
26 if (bones.hasOwnProperty(tempNo)) {
27 createBone();
28 }
else {
29 bones[tempNo] =
{ ln: lineNo, rn: rowNo };
30 }
31 };
32 function CreateBones(bn) {
33 bones =
{};
34 for (
var i =
0; i < bn; i++
) {
35 createBone();
36 }
37 }
38
39 ///用于初始化格子和雷的数量
40 function init (rn, ln, bn) {
41 rowNumber =
parseInt( rn);
42 lineNumber =
parseInt(ln);
43 boneNumber =
parseInt(bn);
44 };
45 function create (id) {
46 var dom =
O(id);
47 createGame(dom);
48 };
49 var index =
0;
50 function createGame(dom) {
51 CreateBones(boneNumber);
52 dom.innerHTML =
'';
53 showCount =
0;
54 var table = document.createElement(
"table");
55 for (
var i =
0; i < rowNumber; i++
) {
56 var tr = document.createElement(
"tr");
57 for (
var j =
0; j < lineNumber; j++
) {
58 var td = document.createElement(
"td");
59 td.style.backgroundColor=
'#808080';
60 td.width =
30;
61 td.height =
30;
62 td.id =
"r" + i +
'l' +
j;
63 td._rowNumber =
i;
64 td._lineNumber =
j;
65 td._index = index++
;
66 td._boneCount =
0;
67 td._context =
0;
68 tr.appendChild(td);
69 td.onclick =
tdClick(td);
70 function tContextFun(dom) {
71 var td =
dom;
72 return function () {
73 if (!
td._show) {
74 if (td._context ==
0) {
75 td._click =
td.onclick;
76 td.onclick =
null;
77 td.innerText =
'标';
78 td._context =
1;
79 }
else if (td._context ==
1) {
80 td.innerText =
'?';
81 td.onclick =
td._click;
82 td._context =
2;
83 }
else {
84 td.innerText =
'';
85 td._context =
0;
86 }
87 }
88 return false;
89 };
90 }
91 td.oncontextmenu =
tContextFun(td);
92 var tempNo = i *
1000 +
j;
93 if (bones.hasOwnProperty(tempNo)) {
94 td._isBone =
true;
95 }
96 }
97 table.appendChild(tr);
98 }
99 dom.appendChild(table);
100 InitNumbers();
101 }
102 function InitNumbers() {
103 var tFun =
function (id) {
104 var dom =
O(id);
105 if (dom !=
null) {
106 if (dom.hasOwnProperty(
'_boneCount')) {
107 dom._boneCount++
;
108 }
else {
109 dom._boneCount =
1;
110 }
111 }
112 };
113 for (
var b
in bones) {
114 var currentRow = bones[b][
'rn'],
115 currentLine = bones[b][
'ln'];
116 tFun(
"r" + (currentRow +
1) +
'l' +
currentLine);
117 tFun(
"r" + (currentRow) +
'l' + (currentLine +
1));
118 tFun(
"r" + (currentRow +
1) +
'l' + (currentLine +
1));
119 tFun(
"r" + (currentRow +
1) +
'l' + (currentLine -
1));
120 tFun(
"r" + (currentRow -
1) +
'l' + (currentLine +
1));
121 tFun(
"r" + (currentRow -
1) +
'l' + (currentLine -
1));
122 tFun(
"r" + (currentRow -
1) +
'l' +
(currentLine));
123 tFun(
"r" + (currentRow) +
'l' + (currentLine -
1));
124
125 }
126 }
127 function tdClick(dom) {
128 return function () {
129 show(dom);
130 };
131 }
132 function show(dom) {
133 if (dom==
null) {
134 return;
135 }
136 var currentLine =
dom._lineNumber;
137 var currentRow =
dom._rowNumber;
138 var tFun =
function (d) {
139 if (d !=
null && !
d._show) {
140 if (d._isBone) {
141 d.innerText =
'Bone';
142 BadShow(d.parentElement.parentElement);
143 }
else if (d._boneCount ) {
144 d.innerText =
d._boneCount;
145 }
else {
146 d.innerText =
'';
147 d.style.backgroundColor =
'white';
148 }
149 d._show =
true;
150 }
151 };
152 tFun(dom);
153 if (++showCount >= (rowNumber * lineNumber -
boneNumber)) {
154 alert(
"You win");
155 }
156 if (dom._isBone ||
dom._boneCount) {
157 return;
158 }
159 var d1 = O(
'r' + (currentRow +
1) +
'l' +
currentLine),
160 d2 = O(
'r' + currentRow +
'l' + (currentLine +
1)),
161 d3 = O(
'r' + (currentRow -
1) +
'l' +
currentLine),
162 d4 = O(
'r' + currentRow +
'l' + (currentLine -
1));
163 if (!(d1 &&
d1._show)) {
164 show(d1);
165 }
166 if (!(d2 &&
d2._show)) {
167 show(d2);
168 }
169 if (!(d3&&
d3._show)) {
170 show(d3);
171 }
172 if (!(d4&&
d4._show)) {
173 show(d4);
174 }
175 }
176 function O(id) {
177 return document.getElementById(id);
178 }
179 function Bclick() {
180 var rn = document.getElementById(
'txtRowCount').value;
181 var ln = document.getElementById(
'txtLineCount').value;
182 var bn = document.getElementById(
'txtBoneCount').value;
183 Start(rn, ln, bn,
'tShow');
184 }
185 function BadShow(tableDom) {
186 var tFun =
function (d) {
187 if (d !=
null && !
d._show) {
188 if (d._isBone) {
189 d.innerText =
'Bone';
190 }
else if (d._boneCount) {
191 d.innerText =
d._boneCount;
192 }
else {
193 d.innerText =
'';
194 d.style.backgroundColor =
'white';
195 }
196 d._show =
true;
197 }
198 };
199 var trLen =
tableDom.childNodes.length;
200 for (
var i =
0; i < trLen; i++
) {
201 var currentTr =
tableDom.childNodes[i];
202 var tdLen =
currentTr.childNodes.length;
203 for (
var j =
0; j < tdLen; j++
) {
204 var currentTd =
currentTr.childNodes[j];
205 if (!
currentTd._show) {
206 tFun(currentTd);
207 }
208 }
209 }
210 alert(
'Faild');
211 }
212 function Start(rn,ln,bn,id) {
213 init(rn, ln, bn);
214 create(id ||
'tShow');
215 }
216 window.onload =
function () {
217 Start(
10,
10,
10);
218 };
219 </script>
220
221 <div id=
"boneDiv">
222 <div>
223 设置：<input type=
"button" value=
"Setting" /><br />
224 <div>
225 <input type=
"button" value=
"高级" οnclick=
"Start(33,33,40)" /><br />
226 <input type=
"button" value =
"中级" οnclick=
"Start(22,22,30)" /><br />
227 <input type=
"button" value=
"初级" οnclick=
"Start(15,15,10)" /><br />
228 <input type=
"button" value=
"弱智" οnclick=
"Start(10,10,1)" />
229 </div>
230 </div>
231 <div>
232 BoneCount:<input type=
"text" id=
"txtBoneCount" /><br />
233 RowCount :<input type=
"text" id=
"txtRowCount" /><br />
234 LineCount :<input type=
"text" id=
"txtLineCount" /><br />
235 <input type=
"button" value=
"自定义" οnclick=
"Bclick()" />
236 </div>
237 <div id=
"tShow">
238
239 </div>
240 </div>
241 <script type=
"text/javascript">
242
243 </script>
244 </body>
245 </html>
View Code
修改了右键出问题的BUG，谢谢朋友们给指出
转载于:https://www.cnblogs.com/hmds/p/3224263.html
相关资源：android扫雷源码
