随机彩票

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>随机彩票</title>
    <style>
        *{
            margin: 0;
            padding: 0;
            list-style: none;
        }
        
        a {
            text-decoration: none;
            color: #333;
        }
        
        .fl {
            float: left;
        }
        
        .fr {
            float: right;
        }
        
        .clearfix:after {
            display: block;
            content: "";
            clear: both;
        }
        
        .selectNum {
            width: 750px;
            border: 1px solid #d3d3d3;
            margin: 50px auto;
        }
        
        .selectNum .redTitle {
            text-align: center;
            width: 423px;
            margin-right: 41px;
        }
        
        .selectNum .blueTitle {
            text-align: center;
            width: 228px;
        }
        
        .selectNum .blueTitle strong {
            color: #1e50a2;
            font-size: 14px;
        }
        
        .selectNum .redTitle strong {
            color: #ba2636;
            font-size: 14px;
        }
        
        .selectNum .title span {
            color: #c4c4c4;
            font-size: 12px;
        }
        
        .ballarea {
            padding-top: 4px;
        }
        
        .redBallBox {
            width: 430px;
            padding-right: 34px;
        }
        
        .redBallBox li {
            width: 33px;
            margin-right: 6px;
            float: left;
            text-align: center;
            height: 50px;
            line-height: 14px;
        }
        
        .redBallBox li a, .redBallBox li a:visited, .blueBallBox li a, .blueBallBox li a:visited {
            background: url(images/balls.png) 0 0 no-repeat;
            width: 33px;
            height: 33px;
            display: block;
            text-align: center;
            line-height: 34px;
            font-size: 16px;
            font-weight: 700;
            overflow: hidden;
            outline: 0;
        }
        
        .redBallBox li a:hover{
            background-position: -35px 0;
        }
        
        .blueBallBox li a:hover{
            background-position: -105px 0;
        }
        
        .redBallBox li a.on {
            background-position: -70px 0;
            color: #fff;
        }
        
        .blueBallBox li a.on {
            background-position: -140px 0;
            color: #fff;
        }
        
        .blueBallBox {
            width: 234px;
        }
        
        .blueBallBox li {
            width: 33px;
            margin-right: 6px;
            float: left;
            text-align: center;
            height: 50px;
            line-height: 14px;
        }
        
        .random_selection {
            text-align: right;
            color: #717171;
            line-height: 22px;
            padding-top: 2px;
            padding-right: 10px;
        }
        
        .random_selection .radom_redbtn:link, .random_selection .radom_redbtn:visited {
            color: #ba2636;
        }
        
        .random_selection select {
            width: 45px;
            line-height: 20px;
        }
        
        .random_selection .radom_bluebtn:link, .random_selection .radom_bluebtn:visited {
            color: #4260a4;
        }
        
        .selectInfo {
            height: 20px;
            clear: both;
            float: none;
            text-align: center;
            padding-top: 11px;
        }
        
        .selectInfo span {
            background: #fff;
            padding: 0 10px;
            display: inline-block;
            position: relative;
            z-index: 10;
        }
        
        .selectInfo strong {
            padding: 0 5px;
        }
        
        .c_ba2636, a.c_ba2636:link, a.c_ba2636:visited {
            color: #ba2636;
        }
        
        .c_1e50a2, a.c_1e50a2:link, a.c_1e50a2:visited {
            color: #1e50a2;
        }
        
        
    </style>
</head>
<body>
    <div class="selectNum clearfix">
        <div class="title">
            <h2 class="redTitle fl">
                <strong>红球区</strong><span>至少选择6个红球</span>
            </h2>
            <h2 class="blueTitle fl">
                <strong>蓝球区</strong><span>至少选择一个蓝球</span>
            </h2>
        </div>
        <div class="ballarea clearfix">
            <div class="redBallBox fl">
                <ul id="redballUl" class="clearfix">
                    <li><a href="javascript:;">01</a></li>
                    <li><a href="javascript:;">02</a></li>
                    <li><a href="javascript:;">03</a></li>
                    <li><a href="javascript:;">04</a></li>
                    <li><a href="javascript:;">05</a></li>
                    <li><a href="javascript:;">06</a></li>
                    <li><a href="javascript:;">07</a></li>
                    <li><a href="javascript:;">08</a></li>
                    <li><a href="javascript:;">09</a></li>
                    <li><a href="javascript:;">10</a></li>
                    <li><a href="javascript:;">11</a></li>
                    <li><a href="javascript:;">12</a></li>
                    <li><a href="javascript:;">13</a></li>
                    <li><a href="javascript:;">14</a></li>
                    <li><a href="javascript:;">15</a></li>
                    <li><a href="javascript:;">16</a></li>
                    <li><a href="javascript:;">17</a></li>
                    <li><a href="javascript:;">18</a></li>
                    <li><a href="javascript:;">19</a></li>
                    <li><a href="javascript:;">20</a></li>
                    <li><a href="javascript:;">21</a></li>
                    <li><a href="javascript:;">22</a></li>
                    <li><a href="javascript:;">23</a></li>
                    <li><a href="javascript:;">24</a></li>
                    <li><a href="javascript:;">25</a></li>
                    <li><a href="javascript:;">26</a></li>
                    <li><a href="javascript:;">27</a></li>
                    <li><a href="javascript:;">28</a></li>
                    <li><a href="javascript:;">29</a></li>
                    <li><a href="javascript:;">30</a></li>
                    <li><a href="javascript:;">31</a></li>
                    <li><a href="javascript:;">32</a></li>
                    <li><a href="javascript:;">33</a></li>
                </ul>
                <p class="random_selection">
                    <select name="">
                        <option value="6" selected="selected">6</option>
                        <option value="7">7</option>
                        <option value="8">8</option>
                        <option value="9">9</option>
                        <option value="10">10</option>
                        <option value="11">11</option>
                        <option value="12">12</option>
                        <option value="13">13</option>
                        <option value="14">14</option>
                        <option value="15">15</option>
                        <option value="16">16</option>
                        <option value="17">17</option>
                        <option value="18">18</option>
                        <option value="19">19</option>
                        <option value="20">20</option>   
                    </select>
                    <a class="radom_redbtn" href="javascript:;">机选红球</a>
                    <a class="clearing" href="javascript:;">清空</a>
                </p>
            </div>
            <div class="blueBallBox fl">
                <ul id="blueBallUl" class="clearfix">
                    <li><a href="javascript:;">01</a></li>
                    <li><a href="javascript:;">02</a></li>
                    <li><a href="javascript:;">03</a></li>
                    <li><a href="javascript:;">04</a></li>
                    <li><a href="javascript:;">05</a></li>
                    <li><a href="javascript:;">06</a></li>
                    <li><a href="javascript:;">07</a></li>
                    <li><a href="javascript:;">08</a></li>
                    <li><a href="javascript:;">09</a></li>
                    <li><a href="javascript:;">10</a></li>
                    <li><a href="javascript:;">11</a></li>
                    <li><a href="javascript:;">12</a></li>
                    <li><a href="javascript:;">13</a></li>
                    <li><a href="javascript:;">14</a></li>
                    <li><a href="javascript:;">15</a></li>
                    <li><a href="javascript:;">16</a></li>
                </ul>
                <p class="random_selection">
                    <select name="">
                        <option value="1" selected="selected">1</option>
                        <option value="2">2</option>
                        <option value="3">3</option>
                        <option value="4">4</option>
                        <option value="5">5</option>
                        <option value="6">6</option>
                        <option value="7">7</option>
                        <option value="8">8</option>
                        <option value="9">9</option>
                        <option value="10">10</option>
                        <option value="11">11</option>
                        <option value="12">12</option>
                        <option value="13">13</option>
                        <option value="14">14</option>
                        <option value="15">15</option>
                        <option value="16">16</option>
                    </select>
                    <a class="radom_bluebtn" href="javascript:;">机选蓝球</a>
                    <a class="clearing" href="javascript:;">清空</a>
                </p>
            </div>
            <p class="selectInfo">
                <span>您当前选中了<strong class="c_ba2636">0</strong>个红球，<strong class="c_1e50a2">0</strong>个蓝球，共<strong class="c_ba2636">0</strong>注，共<strong class="c_ba2636">0</strong>元</span><i></i>
            </p>
        </div>
    </div>
    
    <script>
        var oRedBallBox = getByClass(document, "redBallBox")[0];
        var oBlueBallBox = getByClass(document, "blueBallBox")[0];
        
        var oRedClear = getByClass(oRedBallBox, "clearing")[0];
        var oBlueClear = getByClass(oBlueBallBox, "clearing")[0];
        
        var oRedSel = oRedBallBox.getElementsByTagName("select")[0];
        var oBlueSel = oBlueBallBox.getElementsByTagName("select")[0];
        
        var oRadomRedbtn = getByClass(document, "radom_redbtn")[0];
        var oRadomBluebtn = getByClass(document, "radom_bluebtn")[0];
        
        var oInfo = getByClass(document, "selectInfo")[0];
        
        var aStrong = oInfo.getElementsByTagName("strong");
        
        var oRedballUl = document.getElementById("redballUl");
        var oBlueballUl = document.getElementById("blueBallUl");
        
        var aRed = oRedballUl.getElementsByTagName("a");
        var aRedLi = oRedballUl.getElementsByTagName("li");
        
        var aBlueLi = oBlueballUl.getElementsByTagName("li");
        var aBlue = oBlueballUl.getElementsByTagName("a");
        
        clearFn(oRedClear, aRed);
        clearFn(oBlueClear, aBlue);
        
        //清空选择
        function clearFn(obtn, aColor){
            obtn.onclick = function(){
                for(var i=0; i<aColor.length; i++){
                    aColor[i].className = "";
                }
                
                aStrong[2].innerHTML = 0;
                aStrong[3].innerHTML = 0;
                
                if(obtn == oRedClear){
                    aStrong[0].innerHTML = 0;
                }
                else {
                    aStrong[1].innerHTML = 0;
                }
            }
        }
        
        
        countSelLi(aRedLi);
        countSelLi(aBlueLi);
        
        //统计点击球数
        function countSelLi(aLi){
            for(var i=0; i<aLi.length; i++){
                (function (i){
                    aLi[i].onclick = function(){
                        totalSum();
                    }  
                })(i);
            }
        }
        
        //选择红球下拉菜单
        oRedSel.onchange = function(){
            oRadomRedbtn.click();
        }
        
        //选择蓝球下拉菜单
        oBlueSel.onchange = function(){
            oRadomBluebtn.click();
        }
        
        aSelect(aRed);
        aSelect(aBlue);
        
        function aSelect(Aa){
            for(var i=0; i<Aa.length; i++){
                (function (i){
                    Aa[i].onclick = function(){
                        if(this.className){
                            this.className = "";
                        }
                        else{
                            this.className = "on";
                        }
                    }
                })(i);
            }
        }
        
        var timer = null;
        randomSel(oRadomRedbtn, aRed, oRedSel);
        randomSel(oRadomBluebtn, aBlue, oBlueSel);
        
        //随机选择
        function randomSel(bBtn, aColorAa, oSel){
            
            bBtn.onclick = function(){
                for(var i=0; i<aColorAa.length; i++){
                    aColorAa[i].className = "";
                }

var num = (aColorAa == aRed) ? 6 : 1;
                var all = (aColorAa == aRed) ? 33 : 16;
                var arr = randomNum(all, oSel.selectedIndex + num);
                var iNow = -1;

clearInterval(timer);
                timer = setInterval(function (){
                    iNow++;  
                    if(iNow<arr.length){
                        aColorAa[arr[iNow] - 1].className = "on";
                    }
                    else{
                        clearInterval(timer);
                        timer = null;
                        totalSum();
                    }

}, 60);
                
            };
            
        }
        
        //统计金额
        function totalSum(){
            var aRedNum = countSelNum(aRed);
            var aBlueNum = countSelNum(aBlue);
            
            aStrong[0].innerHTML = aRedNum;
            aStrong[1].innerHTML = aBlueNum;
            
            if( aRedNum >= 6 && aBlueNum >=1 ){
                var rMoney = factorial(aRedNum) / ( factorial(6) * factorial(aRedNum - 6) );
                var bMoney = aBlueNum;
                
                aStrong[2].innerHTML = rMoney * bMoney;
                aStrong[3].innerHTML = 2 * rMoney * bMoney;
                
            }
        }
        
        //为了统计金额而求阶层
        function factorial(i){
            var result = 1;
            while(i>1){
                result = result * i;
                i--;
            }
            
            return result;
        }
        
        //统计球选择数量
        function countSelNum(Aa){
            var count = 0;
            for(var i=0; i<Aa.length; i++){
                if(Aa[i].className.indexOf("on") != -1){
                    count++;
                }
            }
            
            return count;
        }
        
        //生成随机数
        function randomNum(allNum, iNum){
            
            var result = [];
            var arr = [];
            
            for(var i=1; i<=allNum; i++){
                arr.push(i);
            }
            
            for(var j=0; j<iNum; j++){
                result.push( arr.splice(Math.floor(Math.random()*arr.length), 1) );
            }
            
            sortNum(result);
            
            return result;
        }
        
        //数字排序
        function sortNum(arr){
            arr.sort(function (a, b){
                return a - b;
            });
        }
        
        //封装获取class名字的函数
        function getByClass(oParent, sClass){
            var elems = oParent.getElementsByTagName(‘*‘);
            var result = [];
            var re = new RegExp(‘\\b‘ + sClass + ‘\\b‘);
            
            for(var i=0; i<elems.length; i++){
                if( re.test(elems[i].className) ){
                    result.push( elems[i] );
                }
            }
            
            return result;
        }
    </script>
</body>
</html>

效果图：

时间： 2024-10-27 12:05:44

随机彩票的相关文章

双色球——最终版

namespace 刘老师双色球{    class Program    {        static void Main(string[] args)        {            int count = 0;            Console.WriteLine("请输入你的双色球号码");            ArrayList Ual = new ArrayList();            for (int i = 0; i < 7; i++)  

Craps赌博游戏、百钱白鸡、七星彩选号、抓小偷、21根火柴、10000以内完美数

Craps赌博游戏 游戏规则:同时扔两颗骰子,第一次扔出的点数数7或则11玩家胜,扔出2.3或则12庄家胜利,否则继续扔骰子. 以后只要扔出和第一次相同的点数玩家胜,扔出7庄家胜. 玩家每次进入有1000的筹码,输完游戏结束! 1 public static void gambleGame() { 2 int a = 0; 3 int money = 1000; 4 for (int j = 0;; j++) { 5 if (money > 0) { 6 System.out.println(&qu

科技圈晒开工福利！2019一起定个小目标！

阅读本文大概需要 3 分钟. 首先,祝大家开工大吉,不知道你收到的开工福利是什么!!! 作为昨天就已经在工位上奋斗的人,我相信今天大部分公司都已经开工了,许多企业都为员工们了奉上开年红包,我们也来盘点下,今年各大IT企业又有哪些操作呢,一起来八卦一下: 小米红包:五十元配肯德基早餐 小米昨天就已经开工了(昨天开工的不止我一人哈~),雷军.林斌亲自将红包送到大家手上. 很多人会关心,雷军派出的开工红包到底有多少钱.据说红包里不仅只有人民币,也有美元.日元.韩元等多个国家的纸币,每个红包折合人民币金

试探算法_随机生成彩票号码

先给出一般的解决“随机生成7位1—29号数的彩票号码”问题的代码: 1 #include<stdio.h> 2 int main() 3 { 4 int j,i[7];//定义数组保存随机生成不同的7位数字 5 for(i[0]=1;i[0]<=29;i[0]++)//在1——29中随机生成不同的数字 6 for(i[1]=1;i[1]<=29;i[1]++) 7 { 8 if(i[1]==i[0]) continue; 9 for(i[2]=1;i[2]<=29;i[2]+

JavaScript 实现彩票中随机数组的获取

1.效果图: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Math.random方法彩票随机数的生成</title> </head> <body> <!-- 设置样式 --> <input type="text" id="text

JS产生随机一注彩票

<!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8">    <title>彩票</title>    <style type="text/css">    #wrap{        width: 300px;height: 150px;        border: 1px solid r

模拟双色球彩票开奖结果：随机生成一注双色球彩票.......

模拟双色球彩票开奖结果:随机生成一注双色球彩票,判断其是否中奖,奖金为多少.一注双色球彩票由6个不重复的红球(序号:1~32)和1个篮球(序号:1~16)构成.双色球中奖规则如下: (提示:① 随机数:java.util.Random中的Random类有一个方法int nextInt(int n)可以生成0~n的一个随机整数.(教材P202页)② java.util.Arrays的常用方法:Arrays.sort(a); //将数组a中的元素按升序排列:Arrays.binarySearch(a

彩票随机6+1，开发实例

package cn.com.yitong.test; import java.util.ArrayList;import java.util.Collections;import java.util.HashSet;import java.util.Iterator;import java.util.Random;import java.util.Scanner;import java.util.Set; /* * 红球 1~33 篮球1-16 */public class Demo { pr

HTML5 history-hash 随机选择彩票

<!doctype html> <html> <head> <meta charset="utf-8"> <title>无标题文档</title> <script> window.onload = function(){ var oInput = document.getElementsByTagName('input')[0]; var oDiv = document.getElementsByTag