刘谦读心术解密---JavaScript实现

最新推荐文章于 2024-02-11 05:29:17 发布

weixin_33751566

最新推荐文章于 2024-02-11 05:29:17 发布

阅读量294

点赞数

文章标签： javascript python ViewUI

原文链接：https://my.oschina.net/lightled/blog/1925315

版权

2019独角兽企业重金招聘Python工程师标准>>>

录可

<!DOCTYPE HTML>
<html>
	<head>
	<meta charset="UTF-8" />
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<title>刘谦读心术揭秘</title>
<style>
	table td{
		width:40px;height:30px;background-color:grey;
	}
	button{
		width:80px;
		height:40px;
	}
</style>
	</head>
	<body>
	<div align="center">
	   <div   id="tipsstart">
		你，相信读心术吗？？？ <br/>
		 <button onclick="beforeStart()" >相信</button> 
	  </div>
	 <div style="display:none" id="tips">请在心中想一个1~63的数字。不要告诉任何人。<br/>
		<button onclick="startUp()">开始吧</button>
	 </div> 
	   
	  <div>
		 <table id="mytb"></table>
		 <div style="display:none" id="choosediv">
			上面的数字，有没有你心中想的那个数字？
			请诚实选择。<br/>
			<button onclick="choose('yes')">有</button>
			<button onclick="choose('no')" style="margin-left:50px;">没有</button>
		 </div>
	  </div>
	</div>
<script type="text/javascript">
var nums = [
		//第一张牌
			[
			1,3,5,7,9,11,13,15,
			17,19,21,23,25,27,29,31,
			33,35,37,39,41,43,45,47,
			49,51,53,55,57,59,61,63
			],
		//第二张牌：
			[2,3,6,7,10,11,14,15,
			18,19,22,23,26,27,30,31,
			34,35,38,39,42,43,46,47,
			50,51,54,55,58,59,62,63
			],
		//第三张牌
			[4,5,6,7,12,13,14,15,
			20,21,22,23,28,29,30,31,
			36,37,38,39,44,45,46,47,
			52,53,54,55,60,61,62,63
			],
		//第四张牌：
			[8,9,10,11,12,13,14,15,
			 24,25,26,27,28,29,30,31,
			 40,41,42,43,44,45,46,47,
			 56,57,58,59,60,61,62,63
			],
		//第五张牌：
			[16,17,18,19,20,21,22,23,
			24,25,26,27,28,29,30,31,
			48,49,50,51,52,53,54,55,
			56,57,58,59,60,61,62,63
			],
		//第六张牌：
			[32,33,34,35,36,37,38,39,
			40,41,42,43,44,45,46,47,
			48,49,50,51,52,53,54,55,
			56,57,58,59,60,61,62,63
			]
	]

var tdinstance=[];
var nums2 =[];
var choose_index=0;// 1 2 3 4 5 6 
var guess_num = 0;
//1 创建表格
function initTable(){
	var tb = document.getElementById("mytb");
	for(var i=0;i<4;i++){
		var tr = document.createElement("tr");
		for(var j=0;j<8;j++){
			var td = document.createElement("td");
			tr.appendChild(td);
			tdinstance.push(td);
		}
		tb.appendChild(tr);
	}
}
//2 乱序
function luanxu(nums){
	var templist=[];
	for(var i=0;i<6;i++){
		var temp=nums[i].concat([]);
		templist[i]=[];
		//对nums2[i]进行乱序。
		
		while( temp.length > 0  ){
			templist[i].push( temp.splice(parseInt( Math.random()* temp.length ),1)[0] );  		 
		}
	}
	return templist;
}
//3 将数字放入表格中
function showNum(listnum){
	for(var i=0;i<tdinstance.length;i++){
		tdinstance[i].innerText = listnum[i];
	}
}
 
function startUp(){
	document.getElementById("tips").innerHTML="";
	initTable();
	nums2 = luanxu(nums);
	showNum(nums2[0]);
	document.getElementById("choosediv").style.display="";
}

function choose(cmd){
	if(choose_index== 6)return;
	if(cmd == "yes"){
		guess_num+= Math.pow(2,choose_index);
	} 
	choose_index++;
	//切换数字。
	if(choose_index== 6){
		var boolean = confirm("接下来就是见证奇迹的时刻。相信奇迹就点击确定");
		if( boolean ){
			alert("你心中想的数字是："+guess_num);
		}else{
			alert(" 很遗憾你不敢面对现实");
		}
		window.location.reload();
	}else{
		showNum(nums2[choose_index]);
	}
}

function beforeStart(){
	document.getElementById("tipsstart").style.display="none";
	document.getElementById("tips").style.display="";
}
</script>
</body>
</html>

转载于:https://my.oschina.net/lightled/blog/1925315