网页版双色球号码生成工具

最新推荐文章于 2023-12-04 18:18:51 发布

I-L-I

最新推荐文章于 2023-12-04 18:18:51 发布

阅读量3.7k

点赞数 1

分类专栏：随手小记文章标签： html 双色球号码生成工具 js

本文链接：https://blog.csdn.net/dblesk/article/details/46814205

版权

随手小记专栏收录该内容

2 篇文章 0 订阅

订阅专栏

注：需要自己添加和修改jquery.js的引用路径。

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<style>
	.red_ball{
		width:30px;
		height:30px;
		border-width:1px 0px 1px 1px;
		border-color:black;
		border-style:solid;
		float:left;
		line-height:30px;
		text-align:center;
		color:red;
		font-weight:bold;
	}
	.blue_ball{
		width:30px;
		height:30px;
		border:1px solid black;
		float:left;
		line-height:30px;
		text-align:center;
		color:blue;
		font-weight:bold;
	}
	#secDiv{
		padding-top:20px;
		width:100px;
		height:50px;
		clear:both;
	}
	#thirdDiv{
		width:300px;
		height:100px;
		border:1px solid balck;
	}
	#mybut{
		width:60px;
		height:27px;
	}
</style>
<script src="jquery.js"></script>
<!--上面这行改为自己本地的jquery.js文件路径即可-->
<script>
	//标记变量
	var t,s=0;
	$(function(){
		$("#mybut").click(
			function(){
				if(s==0){
					t=window.setInterval('changeNum()',30);
					$(this).html("好");
					s=1;
				}else{
					window.clearInterval(t);
					$(this).html("换一组");
					s=0;
					initDivNum();
				}
			}
		);
		initDivNum();
		//$("#thirdDiv").html(getAGroupNumber());//备用代码
		//window.setInterval('changeNumSingle($("#d1"))',30);
		//window.setInterval('changeNumSingle($("#d2"))',30);
		//window.setInterval('changeNumSingle($("#d3"))',30);
		//window.setInterval('changeNumSingle($("#d4"))',30);
		//window.setInterval('changeNumSingle($("#d5"))',30);
		//window.setInterval('changeNumSingle($("#d6"))',30);
		//t=window.setInterval('changeNum()',30);
	});
	//方法一：一个入口，循环更改各个元素
	function changeNum(){
		for(var i=1;i<=6;i++){
			var num=parseInt($("#d"+i).html(),10);
			if(num>=33){
				num=1;
			}else{
				num++;
			}
			if(num<10){
				$("#d"+i).html('0'+num);
			}else{
				$("#d"+i).html(num);
			}
		}
		var blueNum=parseInt($("#d7").html(),10);
		if(blueNum>=16){
			blueNum=1;
		}else{
			blueNum++;
		}
		if(blueNum<10){
			$("#d7").html('0'+blueNum);
		}else{
			$("#d7").html(blueNum);
		}
	}
	//方法二：分别调用通用方法（备用）
	function changeNumSingle(obj){
		var num=parseInt($(obj).html(),10);
		if(num>=33){
			num=1;
		}else{
			num++;
		}
		if(num<10){
			$(obj).html('0'+num);
		}else{
			$(obj).html(num);
		}
	}
	//获得六个红色球号
	function getAGroupNumber(){
		var arr=new Array(6);
		for(var i=0;i<arr.length;i++){
			var done=false;
			do{
				var num=Math.ceil(Math.random()*33);
				if(i>0){
					var k=0;
					for(var j=0;j<i;j++){
						if(arr[j]==num){
							break;
						}else{
							k++;
						}
					}
					if(k==i){
						arr[i]=num;
						done=true;
					}
				}else{
					arr[i]=num;
					done=true;
				}
			}while(!done);
		}
		arr.sort(function(a,b){
			return a>b?1:-1;
		});
		//return arr[0]+"-"+arr[1]+"-"+arr[2]+"-"+arr[3]+"-"+arr[4]+"-"+arr[5];
		return arr;
	}
	//获得一个蓝色球号
	function getBlueNumber(){
		return Math.ceil(Math.random()*16);
	}
	//产生一个双色球号码
	function initDivNum(){
		var newArr=getAGroupNumber();
		for(var i=0;i<6;i++){
			if(newArr[i]<10){
				$("#d"+(i+1)).html('0'+newArr[i]);
			}else{
				$("#d"+(i+1)).html(newArr[i]);
			}
		}
		var blueNum=getBlueNumber();
		if(blueNum<10){
			$("#d7").html('0'+blueNum);
		}else{
			$("#d7").html(blueNum);
		}
	}
</script>
</head>

<body>
<h1>双色球号码生成工具</h1>
<div>
<div id="d1" class="red_ball">01</div>
<div id="d2" class="red_ball">02</div>
<div id="d3" class="red_ball">03</div>
<div id="d4" class="red_ball">04</div>
<div id="d5" class="red_ball">05</div>
<div id="d6" class="red_ball">06</div>
<div id="d7" class="blue_ball">07</div>
</div>
<div id="secDiv">
<button id="mybut">换一组</button>
</div>
<div id="thirdDiv"></div>
</body>
</html>

完全的html+js前端实现。