原生JS实现网络彩票投注效果
个人游戏之作,小伙伴们研究下就好
主要功能:
1、可自由选择投注模式、倍数,可点击‘×'删除提交注单。
2、可使用jsonp引用官方彩票开奖数据(实时开奖)。
3、结合后台可实现官彩同样的效果。
实现原理:
单纯使用Js实现,这里主要用数组存放数据,随机生成开奖号码,然后进行判断是否中奖。
下面是完整JS代码:
index.html
<!doctypehtml> <htmllang="en"> <head> <metacharset="UTF-8"> <metaname="Generator"content="EditPlus®"> <metaname="Author"content=""> <metaname="Keywords"content=""> <metaname="Description"content=""> <title>彩票--德芙</title> <linkrel="stylesheet"type='text/css'href="css/index.css"/> <scripttype="text/javascript"src='js/sports-1.0-js.js'></script> </head> <body> <divid='Game'> <divclass='G_top'> <divclass="G_t_title"> <h1class='G_t_t_logo'>TanZhouCaiPiao</h1> <pclass='text'>付出不亚于任何人的努力!</p> </div> <divclass='G_t_kaijiang'> <pclass='G_t_k_title'>潭州彩票<spanclass='G_t_k_t_issue'id='G_t_k_t_issue'></span>期</p> <divclass='G_t_k_num'id='G_t_k_num'> <span></span> <span></span> <span></span> <span></span> <span></span> </div> </div> <divclass="G_t_user"> <divclass='G_t_u_name'>德芙纵享丝滑</div> <divclass='G_t_u_buy'> ¥ <spanclass='G_t_u_money'id='G_t_u_money'>1314.51</span> </div> <divclass='supMoney'id='supMoney'> </div> <divclass='addMoney'id='addMoney'> </div> </div> </div> <divid="content"> <divclass='c_left'> <divclass='c_l_mode'id='c_l_mode'> <spanclass='c_l_m_first'>三星</span> <span>定位胆</span> <span>大小单双</span> </div> <divclass="c_l_shuoming"> <divclass="c_l_s_right"id='c_l_s_right'> <ahref="javascript:void(0)">选号规则 <divclass='c_l_s_r_hide'> </div> </a> <ahref="javascript:void(0)">中奖说明 <divclass='c_l_s_r_hide'> </div> </a> <ahref="javascript:void(0)">投注案例 <divclass='c_l_s_r_hide'> </div> </a> </div> </div> <divclass='c_l_number'id='c_l_number'> </div> <divclass='c_l_bottom'> <divclass='c_l_b_function'> <spanclass="c_l_b_f_sup"></span> <inputtype="text"class='c_l_b_f_beishu'id='c_l_b_f_beishu'value='1'/> <spanclass="c_l_b_f_add"></span> <i>倍</i> <selectname="sel_mode"id="sel_mode"class="c_l_b_f_sel"> <optionvalue="1">元</option> <optionvalue="2">角</option> <optionvalue="3">分</option> </select> <pclass='c_l_b_f_jiangjin'>奖金:<spanid='jiangjin'>1800</span></p> <pclass="c_l_b_f_data">选择<spanclass='c_l_b_f_d_num'id='zhushu'>0</span>注,共¥<spanclass='c_l_b_f_d_num'id='money'>0</span>元</p> </div> <divclass='c_l_b_submit'> <inputtype="submit"value='添加号码'id='c_l_b_s_addNum'/> </div> <inputtype="button"value='提交注单'id='c_l_b_deledNum'class='c_l_b_deledNum'/> </div> <textareaid='c_l_data'class='c_l_data'readonly></textarea> </div> <divclass='c_right'> <divclass="c_r_rus"> <divclass="c_r_r_qihao">开奖期号</div> <divclass="c_r_r_haoma">开奖号码</div> <ulid='c_r_r_box'> </ul> </table> </div> <divclass="c_r_list"> <divclass="c_r_l_title"> <span>玩法</span> <span>注数</span> <span>倍数</span> <span>金额</span> <spanclass='close'></span> </div> <ulid='c_r_l_ul'> </ul> </div> <divclass="c_r_touzhu"> <inputtype="button"value='立即投注'id='c_r_t_btn'class='c_r_t_btn'/> </div> </div> </div> </div> <divclass='explain'> <h2>介绍说明</h2> <divid='toggleMove'class='arrow'></div> <p><span>投注方式:</span>请您选择您的投注号码后‘添加号码'==>‘提交注单'==>‘立即投注'</p> <p><span>三星玩法:</span>至少需要在‘百位'、‘十位'、‘个位'三个位置中选择一个号码投注,开奖号码后三位与您投注号码一致即中奖</p> <p><span>定位胆玩法:</span>从任意一个位置选择一个号码即可投注,开奖号码与投注号码的位置、号码相同即中奖</p> <p><span>大小单双玩法:</span>至少需要在‘百位'、‘十位'中选择一个号码投注,开奖号码与投注号码的位置、形态相同即中奖</p> <p><span>功能:</span>可自由选择投注模式、倍数,可点击‘×'删除提交注单</p> <p><span>扩展:</span>可使用jsonp引用官方彩票开奖数据(实时开奖),更多玩法添加请联系我</p> <p><span>Author:</span>Thompson德芙</p> <p><span>转载:</span></p> </div> <scripttype="text/javascript"src='js/index.js'></script> </body> </html>
index.css
@charset="UTF-8"; html,body,ul,li,a,i,div,img,span,p{margin:0;padding:0;} ul,li{list-style:none;} a{text-decoration:none;} i{font-style:normal;} body{ background:url('../img/bg.jpg'); font-family:'Microsoftyahei'; } .clearfix:after{ visibility:hidden; display:block; font-size:0; content:""; clear:both; height:0; } .explain{ height:242px; position:absolute; top:-242px; right:10%; background:rgba(0,0,0,0.5); border-radius:5px; font-size:12px; padding:10px; margin:0auto; color:#fff; } #toggleMove{ height:20px; width:100%; text-align:center; position:absolute; cursor:pointer; transform:scale(1.5); } .arrow{ background:url(../img/arrow.png)no-repeatcenter0; bottom:0; } .close{ background:url(../img/arrow.png)no-repeatcenter-40px; bottom:-18px; } .explainh2{ text-align:center; } .explainp{ margin:5px; } .explainpspan{ color:#ffff33; margin-right:10px; } #Game{ width:1000px; height:500px; margin:50pxauto200px; } #Game.G_top{ width:100%; height:120px; position:relative; } #Game.G_top.G_t_title{ width:600px; height:120px; position:absolute; top:0; left:0; } #Game.G_top.G_t_title.text{ width:100%; position:absolute; left:0; bottom:0; font-size:24px; color:#fff; font-weight:bold; text-shadow:001pxcurrentColor,1px1px1pxrgba(50,93,164,0.8),2px2px3pxrgba(50,93,164,0.8),3px3px4pxrgba(50,93,164,0.8),4px4px5pxrgba(50,93,164,0.8); } #Game.G_top.G_t_title.G_t_t_logo{ width:100%; height:100px; font-size:50px; font-weight:bold; color:rgba(41,76,138,0.8); margin:0; letter-spacing:6px; text-shadow:001pxcurrentColor,2px01px#083058,02px1pxrgba(41,76,138,0.8),2px1px1px#083058,1px2px1px#98c0e8,2px2px1px#487098,3px1px1px#083058,1px3px1pxrgba(41,76,138,0.8),3px2px1px#083058,2px3px1pxrgba(41,76,138,0.8),3px3px1px#487098,4px2px1px#083058,2px4px1pxrgba(41,76,138,0.8),4px3px1px#083058,3px4px1pxrgba(41,76,138,0.8),4px4px1px#487098,5px3px1px#083058,3px5px1px#98c0e8,5px4px1px#083058,4px5px1pxrgba(41,76,138,0.8),5px5px1px#487098,6px4px1px#083058,4px6px1pxrgba(41,76,138,0.8),6px5px1px#083058,5px6px1pxrgba(41,76,138,0.8),6px6px1px#487098,7px5px1px#083058,5px7px1px#98c0e8,7px6px1px#083058,6px7px1px#98c0e8,7px7px1px#487098,8px6px1px#083058,6px8px1px#98c0e8,8px7px1px#083058,7px8px1px#98c0e8,8px8px1px#487098,9px7px1px#083058,7px9px1px#98c0e8,9px8px1px#083058,8px9px1px#98c0e8,9px9px1px#487098,10px8px1px#083058,8px10px1px#98c0e8,10px9px1px#083058,9px10px1px#98c0e8,10px10px1px#487098,11px9px1px#083058,9px11px1px#98c0e8,11px10px1px#083058,10px11px1px#98c0e8,11px11px1px#487098,11px11px1px#666,11px12px1px#666,10px12px1px#666,9px12px1px#666,8px11px1px#666,7px10px1px#666,6px9px1px#666,5px8px1px#666,4px7px1px#666,3px6px1px#666,2px5px1px#666,1px4px1px#666,03px1px#666,-1px2px1px#666,20px8px8pxrgba(0,0,0,.7); } h1:before,h1:after{ content:'TanZhouCaiPiao'; position:absolute; top:0; left:0; right:0; color:rgba(41,76,138,0.8); text-shadow:001pxcurrentColor,-1px-1px1px#003,0-1px1px#003,1px-1px1px#003,1px01px#003,1px1px1px#003,01px1px#003,-1px1px1px#003,-1px01px#003; } h1:after{ color:rgba(40,80,120,.1); text-shadow:1px-1px1pxrgba(40,80,120,.8),-1px1px1pxrgba(255,255,255,.8); } #Game.G_top.G_t_kaijiang{ width:360px; height:110px; background:rgba(41,76,138,0.8); padding:5px; position:absolute; right:0;top:0; } #Game.G_top.G_t_kaijiang.G_t_k_title{ width:360px; line-height:20px; background:rgba(51,51,51,0.8); color:#fff; font-size:14px; text-align:center; } #Game.G_top.G_t_kaijiang.G_t_k_title.G_t_k_t_issue{ margin:05px; color:#399; } #Game.G_top.G_t_kaijiang.G_t_k_num{ width:100%; height:90px; } #Game.G_top.G_t_kaijiang.G_t_k_numspan{ display:block; width:59px; height:57px; margin-left:11px; margin-top:16px; float:left; background:url('../img/num.png')-423px-119px; } #Game.G_top.G_t_kaijiang.G_t_k_numspan.kaijiang{ background:url('../img/mv.gif'); background-position:'0px0px'; } #Game.G_top.G_t_user{ width:240px; height:40px; position:absolute; bottom:-20px; left:350px; } #Game.G_top.G_t_user.supMoney,#Game.G_top.G_t_user.addMoney{ width:140px; height:40px; position:absolute; top:0px; right:-80px; font-weight:bold; font-size:24px; color:#ff6700; opacity:1; } #Game.G_top.G_t_user.addMoney{ color:#00ff66; } #Game.G_top.G_t_user>div{ width:100px; line-height:40px; text-align:center; float:left; color:#fff; } #Game.G_top.G_t_user.G_t_u_buy{ color:#ff0; } #Game.G_top.G_t_user.G_t_u_buy.G_t_u_money{ color:#ff6700; } #content{ width:100%; height:350px; margin-top:30px; } #content.c_left{ width:680px; height:100%; float:left; position:relative; } #content.c_left.c_l_mode{ width:672px; height:38px; padding:3px; background:rgba(0,0,0,0.8); border-radius:5px; } #content.c_left.c_l_mode>span{ width:70px; height:34px; display:block; float:left; font-family:14px; text-align:center; line-height:34px; margin:2px10px2px0px; background:rgb(78,70,63); border-radius:5px; color:#fff; cursor:pointer; transition:0.3s; -moz-transition:0.3s; -webkit-transition:0.3s; -o-transition:0.3s; -ms-transition:0.3s; } #content.c_leftspan.c_l_m_first{ background:rgba(31,58,110,1); } #content.c_left.c_l_mode>span:hover{ background:rgba(31,58,110,1); } #content.c_left.c_l_shuoming{ margin-top:10px; width:100%; height:44px; background:rgba(0,0,0,0.8); border-radius:5px; } #content.c_left.c_l_shuoming.c_l_s_right{ width:260px; height:20px; float:right; margin:11px10px11px0px; } #content.c_left.c_l_shuoming.c_l_s_right>a{ display:block; width:78px; height:20px; float:left; line-height:20px; font-size:12px; color:#fff; text-align:center; margin-right:7px; background:url('../img/icon.png')no-repeat; position:relative; } #content.c_left.c_l_shuoming.c_l_s_right>a.c_l_s_r_hide{ width:200px; padding:5px; color:#e8e9e9; background:rgba(41,76,138,0.8); position:absolute; right:0px; top:30px; border-radius:5px; display:none;; } #content.c_left.c_l_number{ width:660px; height:160px; margin-top:20px; padding:010px; } #content.c_left.c_l_numberul{ width:660px; height:50px; } #content.c_left.c_l_numberul:after{ visibility:hidden; display:block; font-size:0; content:""; clear:both; height:0; } #content.c_left.c_l_number.c_l_n_align{ color:#ffbe13; width:60px; height:50px; float:left; line-height:50px; } #content.c_left.c_l_numberulli{ float:left; width:43px; height:43px; border-radius:50%; line-height:43px; color:#fff; text-align:center; cursor:pointer; margin:3px5px4px0px; background:url('../img/icon.png')no-repeat-46px-57px; } #content.c_left.c_l_number.c_l_n_btn{ margin-top:5px; width:100px; height:40px; float:right; } #content.c_left.c_l_number.c_l_n_btn>span{ display:block; width:30px; height:20px; float:left; color:#fff; font-size:12px; line-height:20px; text-align:center; background:#4a433c; border-radius:3px; margin:1px; cursor:pointer; transition:0.3s; -moz-transition:0.3s; -webkit-transition:0.3s; -o-transition:0.3s; -ms-transition:0.3s; } #content.c_left.c_l_number.c_l_n_btn>span:hover{ background:rgb(50,93,164); } #content.c_left.c_l_bottom{ width:100%; height:34px; margin-top:20px; position:relative; } #content.c_left.c_l_bottom.c_l_b_function{ width:540px; height:34px; padding-left:10px; background:rgba(0,0,0,0.8); float:left; border-radius:5px; line-height:34px; color:#fff; font-size:12px; } #content.c_left.c_l_bottom.c_l_b_functioni{ float:left; margin:05px; } #content.c_left.c_l_bottom.c_l_b_function.c_l_b_f_sup{ display:block; width:16px; height:16px; margin-top:9px; background:url('../img/sub.png')no-repeat; float:left; cursor:pointer; } #content.c_left.c_l_bottom.c_l_b_function.c_l_b_f_beishu{ width:60px; height:24px; background:#333; border:none; border-radius:5px; float:left; margin:5px; text-align:center; color:#ff6700; outline:none; } #content.c_left.c_l_bottom.c_l_b_function.c_l_b_f_add{ display:block; width:16px; height:16px; margin-top:9px; background:url('../img/add.png')no-repeat; float:left; cursor:pointer; } #content.c_left.c_l_bottom.c_l_b_function.c_l_b_f_sel{ width:50px; height:24px; background:#333; border:none; border-radius:5px; float:left; margin:5px20px; text-align:center; color:#ff6700; cursor:pointer; outline:none; } #content.c_left.c_l_bottom.c_l_b_function.c_l_b_f_jiangjin{ width:70px; height:100%; display:inline-block; } #content.c_left.c_l_bottom.c_l_b_function.c_l_b_f_jiangjinspan{ color:#ff6700; } #content.c_left.c_l_bottom.c_l_b_function.c_l_b_f_data{ width:200px; float:right; } #content.c_left.c_l_bottom.c_l_b_function.c_l_b_f_data.c_l_b_f_d_num{ margin:05px; color:#ff6700; } #content.c_left.c_l_bottom.c_l_b_function:after{ visibility:hidden; display:block; font-size:0; content:""; clear:both; height:0; } #content.c_left.c_l_bottom.c_l_b_submit{ width:94px; height:28px; padding:3px; float:right; background:rgba(0,0,0,0.8); border-radius:5px; margin-right:10px; } #content.c_left.c_l_bottom.c_l_b_submit>input{ width:94px; height:28px; border-radius:3px; font-size:16px; font-family:'Microsoftyahei'; background:rgba(50,93,164,0.8); border:none; color:#fff; cursor:pointer; } #content.c_left.c_l_bottom.c_l_b_submit>input:hover{ background:rgba(50,93,164,1); } #content.c_left.c_l_bottom.c_l_b_deledNum{ position:absolute; bottom:-33px; left:0px; width:94px; height:28px; border-radius:3px; font-size:16px; font-family:'Microsoftyahei'; background:rgba(50,93,164,0.8); border:none; color:#fff; cursor:pointer; outline:none; } #content.c_left.c_l_bottom.c_l_b_deledNum:hover{ background:rgba(50,93,164,1); } #content.c_left.c_l_data{ min-width:660px; max-width:660px; min-height:115px; position:absolute; top:370px; left:0; border-radius:5px; background:rgba(0,0,0,0.8); border:none; color:#fff; padding:5px10px; font-size:14px; font-family:'merriweather,arial,sans-serif'; letter-spacing:2px; } /*right*/ #content.c_right{ width:300px; height:100%; float:right; } #content.c_right>div{ border-radius:5px; background:rgba(0,0,0,0.8); } #content.c_right.c_r_rus{ width:100%; height:185px; position:relative; } #content.c_right.c_r_rus>div{ position:absolute; color:#ff6700; height:30px; line-height:30px; text-align:center; width:150px; } #content.c_right.c_r_rus.c_r_r_qihao{ left:0;top:0; } #content.c_right.c_r_rus.c_r_r_haoma{ right:0;top:0; } #content.c_right.c_r_rusul{ width:100%; position:absolute; top:30px;left:0; color:#fff; } #content.c_right.c_r_rusulli{ height:30px; width:100%; } #content.c_right.c_r_rusullispan{ display:inline-block; width:150px; height:30px; line-height:30px; float:left; text-align:center; } #content.c_right.c_r_list{ width:280px; height:150px; padding:10px; text-align:left; margin:20pxauto; color:#fff; font-size:14px; } #content.c_right.c_r_list.c_r_l_title{ width:100%; height:30px; } #content.c_right.c_r_list.c_r_l_titlespan{ display:inline-block; width:60px; text-align:center; line-height:20px; color:#ff6700; } #content.c_right.c_r_listulli{ width:100%; height:20px; } #content.c_right.c_r_listullispan{ display:inline-block; width:60px; text-align:center; line-height:20px; margin-right:4px; } #content.c_right.c_r_listullispan.list_close{ width:20px; height:20px; text-align:right; cursor:pointer; color:#ff6700; } #content.c_right.c_r_l_titlespan.close{ width:20px;height:20px; background-image:url('../img/icon.png'); background-repeat:no-repeat; background-position:-67px-21px; cursor:pointer; } #content.c_right.c_r_touzhu{ margin-top:15px; padding:5px; color:#fff; text-align:center; } /* #content.c_right.c_r_touzhuspan{ color:#ff6700; } #content.c_right.c_r_touzhu.c_r_t_issue{ } #content.c_right.c_r_touzhu.c_r_t_queren{ font-size:14px; margin:15px0; }*/ #content.c_right.c_r_touzhu.c_r_t_btn{ width:100%; height:50px; background:rgba(50,93,164,0.8); border:none; border-radius:5px; color:#fff; font-size:26px; font-family:'Microsoftyahei'; font-weight:bold; cursor:pointer; outline:none; transition:0.3s; -moz-transition:0.3s; -webkit-transition:0.3s; -o-transition:0.3s; -ms-transition:0.3s; } #content.c_right.c_r_touzhu.c_r_t_btn:hover{ background:rgba(50,93,164,1); }
index.js
window.onload=function(){ vartoggleMove=document.getElementById('toggleMove'); vartoggleOff=true; Game.init(); move(toggleMove.parentNode,{'top':'0px'},'10'); toggleMove.onclick=function(){ if(toggleOff){ move(toggleMove.parentNode,{'top':'-242px'},'10'); this.className='close'; toggleOff=!toggleOff; }else{ move(toggleMove.parentNode,{'top':'0px'},'10'); this.className='arrow'; toggleOff=!toggleOff; } } } varGame={ 'numPos':['-63px-61px','-3px-3px','-63px-3px','-123px-3px','-183px-3px','-243px-3px','-303px-3px','-363px-3px','-423px-3px','-3px-61px'], 'oNum':document.getElementById('c_l_number'), 'personMon':document.getElementById('G_t_u_money'), 'alignArr':['百位','十位','个位'], 'btnArr':['全','大','小','奇','偶','清'], 'qishu':0, 'step':'0', 'Data':[], 'targetData':[], 'OrderArr':[], 'num':'1', 'amountX':0, 'wanfa':null, 'init':function(){ varoMode=document.getElementById('c_l_mode').getElementsByTagName('span'); varjiangjin=document.getElementById('jiangjin'); this.addInitCase1(); this.addRegulation('0'); this.control(); this.controlInput(Game.amountX); this.controlSelect(Game.num); this.getNumData(Game.step); this.empty(); for(vari=0;i<oMode.length;i++) { oMode[i].index=i; oMode[i].onclick=function(){ Game.step=this.index; for(varj=0;j<oMode.length;j++) { oMode[j].className=''; } this.className='c_l_m_first'; switch(this.index){ case0: Game.addInitCase1(); jiangjin.innerHTML='1800'; break; case1: Game.addInitCase1(); jiangjin.innerHTML='18'; break; case2: Game.addInitCase2(); jiangjin.innerHTML='7.8'; break; } Game.Data.length=0; Game.addRegulation(this.index); Game.getNumData(Game.step); Game.control(); } } }, 'addInitCase1':function(){ this.oNum.innerHTML=''; for(vari=0;i<this.alignArr.length;i++) { varoNum_ul=document.createElement('ul'); varoNum_ul_div=document.createElement('div'); oNum_ul_div.innerHTML=this.alignArr[i]; oNum_ul_div.className='c_l_n_align'; oNum_ul.appendChild(oNum_ul_div); for(varj=0;j<10;j++) { varoNum_ul_li=document.createElement('li'); oNum_ul_li.off=true; oNum_ul_li.className='li'+i; oNum_ul_li.innerHTML=j; oNum_ul.appendChild(oNum_ul_li); } varoNum_ul_Rdiv=document.createElement('div'); for(varz=0;z<this.btnArr.length;z++) { varoSpan=document.createElement('span'); oSpan.className='span'+i; oSpan.innerHTML=this.btnArr[z]; oNum_ul_Rdiv.appendChild(oSpan); } oNum_ul_Rdiv.className='c_l_n_btn'; oNum_ul.appendChild(oNum_ul_Rdiv); this.oNum.appendChild(oNum_ul); } }, 'addInitCase2':function(){ this.oNum.innerHTML=''; varinit1Arr=['大','小','单','双']; for(vari=0;i<this.alignArr.length-1;i++) { varoNum_ul=document.createElement('ul'); varoNum_ul_div=document.createElement('div'); oNum_ul_div.innerHTML=Game.alignArr[i]; oNum_ul_div.className='c_l_n_align'; oNum_ul.appendChild(oNum_ul_div); for(varj=0;j<init1Arr.length;j++) { varoNum_ul_li=document.createElement('li'); oNum_ul_li.off=true; oNum_ul_li.className='li'+i; oNum_ul_li.innerHTML=init1Arr[j]; oNum_ul.appendChild(oNum_ul_li); } varoNum_ul_Rdiv=document.createElement('div'); varoSpan=document.createElement('span'); oSpan.innerHTML=this.btnArr[5]; oSpan.className='span'+i; oNum_ul_Rdiv.appendChild(oSpan); oNum_ul_Rdiv.className='c_l_n_btn'; oNum_ul.appendChild(oNum_ul_Rdiv); this.oNum.appendChild(oNum_ul); } }, 'addRegulation':function(step){ varoP=document.getElementById('c_l_s_right'); varoHide=this.getClassName(oP,'c_l_s_r_hide'); vardata=[ ['从百位、十位、个位各选一个号码组成一注。','从百位、十位、个位中选择一个3位数号码组成一注,所选号码与开奖号码后3位相同,且顺序一致,即为中奖。','投注方案:345</br>开奖号码:345,即中后三直选。'], ['在百位、十位、个位任意位置上任意选择1个或1个以上号码。','从百位、十位、个位任意位置上至少选择1个以上号码,所选号码与相同位置上的开奖号码一致,即为中奖。','投注方案:百位1</br>开奖号码:百位1,即中定位胆百位。'], ['从百位、十位中的“大、小、单、双”中至少各选一个组成一注。','对百位和十位的“大(56789)小(01234)、单(13579)双(02468)”形态进行购买,所选号码的位置、形态与开奖号码的位置、形态相同,即为中奖。','投注方案:小双</br>开奖号码:百位与十位“小双”,即中前二大小单双。'] ]; for(vari=0;i<oHide.length;i++) { oHide[i].index=i; oHide[i].innerHTML=data[step][i]; oHide[i].parentNode.onmouseover=function(ev){ ev=ev||window.event; ev.preventDefault(); for(varj=0;j<oHide.length;j++) { oHide[j].style.display='none'; } this.children[0].style.display='block'; } } for(vari=0;i<oHide.length;i++) { oHide[i].parentNode.onmouseout=function(ev){ ev=ev||window.event; ev.preventDefault(); this.children[0].style.display='none'; } } }, 'getNumData':function(step){ varaddBtn=document.getElementById('c_l_b_s_addNum'); varoText=document.getElementById('c_l_data'); varamount=document.getElementById('zhushu'); varmoney=document.getElementById('money'); varoInput=document.getElementById('c_l_b_f_beishu'); varoUl=this.oNum.children; this.Data[step]=[]; for(vari=0;i<oUl.length;i++) { this.Data[step][i]=[]; this.select(this.getClassName(oUl[i],'li'+i),this.Data[step][i]); } addBtn.onclick=function(){ oText.innerHTML=''; Game.Data[Game.Data.length]=step; Game.targetData=addNum(Game.Data); /**************************/ if(Game.targetData.length){ switch(parseInt(step)){ case0: Game.amountX=Game.targetData.length amount.innerHTML=Game.amountX; oText.innerHTML=Game.targetData; break; case1: Game.amountX=Game.targetData.length; amount.innerHTML=Game.amountX; for(vari=0;i<Game.targetData.length;i++) { oText.innerHTML+=Game.targetData[i]+'n'; } break; case2: Game.amountX=Game.targetData.length amount.innerHTML=Game.amountX; oText.innerHTML=Game.targetData; break; } Game.wanfa=step; money.innerHTML=Game.count.accMul(Game.num,Game.amountX*2*oInput.value); }else{ money.innerHTML='0'; amount.innerHTML='0'; alert('请选择正确的投注方式!'); } /**************************/ } functionaddNum(Data){ varn=parseInt(Data[Data.length-1]); switch(n){ case0: returngetResultOne(Data[n]); break; case1: returngetResultTwo(Data[n]); break; case2: returngetResultThree(Data[n]); break; } } functiongetResultOne(Arr){ varnewArr=[]; if(Arr[0].length>0&&Arr[1].length>0&&Arr[2].length>0){ for(vari=0;i<Arr[0].length;i++) { for(varj=0;j<Arr[1].length;j++) { for(varz=0;z<Arr[2].length;z++) { newArr.push(Arr[0][i]+''+Arr[1][j]+''+Arr[2][z]); } } } newArr.sort(function(a,b){ returna-b; }); returnnewArr; }else{ returnfalse; } } functiongetResultTwo(Arr){ varstrArr=['百位','十位','个位']; varnewArr=[]; for(vari=0;i<Arr.length;i++) { if(Arr[i].length){ for(varj=0;j<Arr[i].length;j++) { newArr.push(strArr[i]+':'+Arr[i][j]) } }else{ continue; } } returnnewArr; } functiongetResultThree(Arr){ varnewArr=[]; if(Arr[0].length>0&&Arr[1].length>0){ for(vari=0;i<Arr[0].length;i++) { for(varj=0;j<Arr[1].length;j++) { newArr.push(Arr[0][i]+''+Arr[1][j]); } } newArr.sort(function(a,b){ returna-b; }); returnnewArr; }else{ returnfalse; } } }, 'select':function(obj,arr){ varoText=document.getElementById('c_l_data'); varthree=['大','小','单','双']; for(vari=0;i<obj.length;i++) { obj[i].index=i; obj[i].off=true; obj[i].onclick=function(){ varoSpan=this.parentNode.getElementsByTagName('span'); for(vari=0;i<oSpan.length;i++) { oSpan[i].style.background='#4a433c'; } if(this.off){ this.style.backgroundPosition='-2px-57px'; arr.push(obj[this.index].innerHTML); this.off=!this.off; }else{ this.style.backgroundPosition='-46px-57px'; if(arr.length){ for(varj=0;j<arr.length;j++) { if(Game.step==2){ if(arr[j]==three[this.index]){ arr.splice(j,1); } }else{ if(arr[j]==this.index){ arr.splice(j,1); } } } } this.off=!this.off; } } } }, 'control':function(){ varoSpan,num; varcontrolDiv=this.getClassName(this.oNum,'c_l_n_btn'); for(vari=0;i<controlDiv.length;i++) { controlDiv[i].index=i; oSpan=this.getClassName(controlDiv[i],'span'+i); for(varj=0;j<oSpan.length;j++) { oSpan[j].index=j oSpan[j].onclick=function(){ num=this.parentNode.index; Game.Data[Game.step][num].length=0; varoParent=this.parentNode.parentNode; varoLi=oParent.getElementsByTagName('li'); for(varz=0;z<oLi.length;z++) { oLi[z].style.backgroundPosition='-46px-57px'; oLi[z].off=true; } if(Game.step!=2){ varsiblings=this.parentNode.children; for(varz=0;z<siblings.length;z++) { siblings[z].style.background='#4a433c'; } Game.controlFn(oLi,num,this.index); } this.style.background='rgb(50,93,164)'; } } } }, 'controlFn':function(oLi,num,index){ varhalf=parseInt(oLi.length/2); for(vari=0;i<oLi.length;i++) { switch(index) { case0: oLi[i].style.backgroundPosition='-2px-57px'; oLi[i].off=false; Game.Data[Game.step][num].push(i); break; case1: if(i>half-1){ oLi[i].style.backgroundPosition='-2px-57px'; oLi[i].off=false; Game.Data[Game.step][num].push(i); } break; case2: if(i<half){ oLi[i].style.backgroundPosition='-2px-57px'; oLi[i].off=false; Game.Data[Game.step][num].push(i); } break; case3: varn=(i*2)-1; if(n>0&&n<oLi.length){ oLi[n].style.backgroundPosition='-2px-57px'; oLi[n].off=false; Game.Data[Game.step][num].push(n); } break; case4: if(i*2<oLi.length-1){ oLi[i*2].style.backgroundPosition='-2px-57px'; oLi[i*2].off=false; Game.Data[Game.step][num].push(i*2); } break; case5: oLi[i].style.backgroundPosition='-46px-57px'; oLi[i].off=true; Game.Data[Game.step][num].length=0; break; } } }, //倍数Input 'controlInput':function(amountX){ varmoney=document.getElementById('money'); varoInput=document.getElementById('c_l_b_f_beishu'); varoBtn=oInput.parentNode.getElementsByTagName('span'); for(vari=0;i<oBtn.length;i++) { oBtn[i].index=i; oBtn[i].onclick=function(){ if(this.index){ if(oInput.value<9999){ oInput.value++; } }else{ if(oInput.value>0){ oInput.value--; } } money.innerHTML=Game.count.accMul(Game.num,Game.amountX*2*oInput.value); } } oInput.addEventListener('input',function(){ if(!this.value){ this.value=0; }else{ if(this.value>9999){ this.value=9999; }else{ this.value=parseInt(this.value); } } money.innerHTML=Game.count.accMul(Game.num,Game.amountX*2*this.value); },false); }, 'controlSelect':function(){ varoInput=document.getElementById('c_l_b_f_beishu'); varmoney=document.getElementById('money'); varoMode=document.getElementById('sel_mode'); oMode.addEventListener('input',function(){ switch(this.value){ case'1': Game.num=1; break; case'2': Game.num=0.1; break; case'3': Game.num=0.01; break; } money.innerHTML=Game.count.accMul(Game.num,Game.amountX*2*oInput.value); },false); }, 'empty':function(){ varoDiv=document.getElementById('c_l_number'); varemptyBtn=document.getElementById('c_l_b_deledNum'); varoText=document.getElementById('c_l_data'); varmoney=document.getElementById('money'); varamount=document.getElementById('zhushu'); varlistUl=document.getElementById('c_r_l_ul'); varoInput=document.getElementById('c_l_b_f_beishu'); varoMode=document.getElementById('sel_mode'); varjiangjin=document.getElementById('jiangjin'); vararr=['三星直选','定位胆','大小单双']; emptyBtn.onclick=function(){ if(parseInt(money.innerHTML*999)){ varjson={a:jiangjin.innerHTML,b:amount.innerHTML,c:oInput.value,d:money.innerHTML,e:Game.targetData,f:Game.num}; Game.OrderArr.push(json); varoLi=document.createElement('li'); oLi.innerHTML='<spandata-step="'+Game.wanfa+'">'+arr[Game.wanfa]+'</span><span>'+amount.innerHTML+'</span><span>'+oInput.value+'</span><span>'+money.innerHTML+'</span><spanclass="list_close">×</span>'; listUl.appendChild(oLi); /************************************************************/ oDiv.innerHTML=''; oText.innerHTML=''; money.innerHTML='0'; amount.innerHTML='0'; switch(parseInt(Game.step)){ case0: Game.addInitCase1(); break; case1: Game.addInitCase1(); break; case2: Game.addInitCase2(); break; } Game.getNumData(Game.step); Game.control(); Game.amountX=0; if(Game.OrderArr.length){ Game.delOrder(); Game.pushIn(); } }else{ if(parseInt(amount.innerHTML)) { alert('提交注单失败,请您核实投注金额重新提交!'); }else{ alert('请您提交号码,再提交订单哟!'); } } } }, 'delOrder':function(){ varoUl=document.getElementById('c_r_l_ul'); varcloseBtn=this.getClassName(oUl,'list_close'); for(vari=0;i<closeBtn.length;i++) { closeBtn[i].index=i; closeBtn[i].onclick=function(){ Game.OrderArr.splice(this.index,1); this.parentNode.parentNode.removeChild(this.parentNode); } } }, 'pushIn':function(){ varsupMoney=document.getElementById('supMoney'); varoPushBtn=document.getElementById('c_r_t_btn'); oPushBtn.onclick=function(){ varmoney=0; varpM=Game.personMon.innerHTML; if(Game.OrderArr.length){ for(vari=0;i<Game.OrderArr.length;i++) { money=Game.count.accAdd(money,Game.OrderArr[i].d) } if(pM>money){ if(confirm('您选择'+Game.OrderArr.length+'个注单,投注总金额'+money+'元')) { Game.personMon.innerHTML=Game.count.accSubtr(pM,money); supMoney.innerHTML='-'+money; move(supMoney,{top:'50px',opacity:'0'},'50',function(){ supMoney.innerHTML=''; this.style.cssText='top:0;opacity:1;'; }); Game.kaijiang(Game.getAward); }else{ } }else{ alert('余额不足,请充值后再进行投注!'); } }else{ alert('请您选择号码,提交注单后投注!'); } } }, 'kaijiang':function(callback){ varresult=[]; varoff=false; varoSpan=document.getElementById('G_t_k_num').children; varlistUl=document.getElementById('c_r_l_ul'); for(vari=listUl.children.length-1;i>=0;i--) { listUl.children[i].parentNode.removeChild(listUl.children[i]); } for(vari=0;i<oSpan.length;i++) { oSpan[i].className='kaijiang'; oSpan[i].style.transitionDelay='0s'; } setTimeout(function(){ for(vari=0;i<oSpan.length;i++) { varn=Math.floor(Math.random()*10); result.push(n); oSpan[i].className=''; oSpan[i].style.transitionDelay=i*0.3+'s'; oSpan[i].style.backgroundPosition=Game.numPos[n]; } returncallback(result); },1500); }, 'getAward':function(res){ varissue=document.getElementById('G_t_k_t_issue'); varoBox=document.getElementById('c_r_r_box'); issue.innerHTML=addZero(Game.qishu); if(oBox.children.length==5){ varremoveObj=oBox.children[4]; removeObj.parentNode.removeChild(removeObj); } varoLi=document.createElement('li'); oLi.innerHTML='<spanclass="qishu">'+addZero(Game.qishu)+'</span><spanclass="haoma">'+res+'</span>'; if(oBox.children.length){ oBox.insertBefore(oLi,oBox.children[0]) }else{ oBox.appendChild(oLi); } functionaddZero(a){ a++; if(a<10){ return'00'+a; }elseif(a<100){ return'0'+a; }else{ return''+a; } } Game.qishu++; Game.setMoney(res); Game.targetData.length=0; }, 'setMoney':function(res){ varaddMoney=document.getElementById('addMoney'); varregB=/百位/,regS=/十位/,regG=/个位/; varbArr=[],sArr=[],gArr=[]; varsan=res[2]+""+res[3]+""+res[4]; vararr=[]; arr.push(((res[2]%2?'单':'双')+(res[3]%2?'单':'双'))); arr.push(((res[2]>4?'大':'小')+(res[3]%2?'单':'双'))); arr.push(((res[2]>4?'大':'小')+(res[3]>4?'大':'小'))); varmoneyAward=0; varn=null; for(vari=0;i<this.OrderArr.length;i++) { n=this.OrderArr[i] switch(n.a){ case'1800': for(varz=0;z<n.e.length;z++) { if(san==n.e[z]){ moneyAward=this.count.accAdd(moneyAward,this.count.accMul(n.a*n.c,n.f)); break; } } break; case'18': vark=0; for(varz=0;z<n.e.length;z++) { if(regB.test(n.e[z])){ if(newRegExp(res[2]).test(n.e[z])) { k++; continue; } }elseif(regS.test(n.e[z])){ if(newRegExp(res[3]).test(n.e[z])) { k++; continue; } }elseif(regG.test(n.e[z])){ if(newRegExp(res[4]).test(n.e[z])) { k++; continue; } } } moneyAward=this.count.accAdd(moneyAward,this.count.accMul(n.f,n.a*k*n.c)); break; case'7.8': //中奖注数初始值 varj=0; for(varz=0;z<n.e.length;z++) { for(varx=0;x<arr.length;x++){ if(n.e[z]==arr[x]) { j++; continue; } } } moneyAward=this.count.accAdd(moneyAward,this.count.accMul(n.f,n.a*j*n.c)); break; } } if(moneyAward){ addMoney.innerHTML='+'+moneyAward; move(addMoney,{top:'-50px',opacity:'0'},'50',function(){ addMoney.innerHTML=''; this.style.cssText='top:0;opacity:1;'; }); } this.personMon.innerHTML=this.count.accAdd(this.personMon.innerHTML,moneyAward); this.OrderArr.length=0; }, 'getClassName':function(obj,cName){ varobj=obj||document; if(obj.getElementsByClassName) { returnobj.getElementsByClassName(cName); }else{ vararr=[]; varallE=obj.getElementsByTagName('*'); for(vari=0;i<allE.length;i++) { varallElements=allE[i].className.split(''); for(varj=0;j<allElements.length;j++) { if(allElements[j].className==cName) { arr.push(allE[i]); break; } } } returnarr; } }, 'count':{ //乘 'accMul':function(a,b) { varm=0,s1=a.toString(),s2=b.toString(); try{m+=s1.split(".")[1].length}catch(e){} try{m+=s2.split(".")[1].length}catch(e){} returnNumber(s1.replace(".",""))*Number(s2.replace(".",""))/Math.pow(10,m) }, //除 'accDiv':function(a,b){ vart1=0,t2=0,r1,r2; try{t1=a.toString().split(".")[1].length}catch(e){} try{t2=b.toString().split(".")[1].length}catch(e){} with(Math){ r1=Number(a.toString().replace(".","")) r2=Number(b.toString().replace(".","")) return(r1/r2)*pow(10,t2-t1); } }, //加 'accAdd':function(a,b){ varr1,r2,m; try{r1=a.toString().split(".")[1].length}catch(e){r1=0} try{r2=b.toString().split(".")[1].length}catch(e){r2=0} m=Math.pow(10,Math.max(r1,r2)) return(a*m+b*m)/m; }, //减 'accSubtr':function(a,b){ varr1,r2,m,n; try{r1=a.toString().split(".")[1].length}catch(e){r1=0} try{r2=b.toString().split(".")[1].length}catch(e){r2=0} m=Math.pow(10,Math.max(r1,r2)); n=(r1>=r2)?r1:r2; return((a*m-b*m)/m).toFixed(n); } } }
sports-1.0-js.js
functiongetStyle(obj,attr){ if(obj.currentStyle){ returnobj.currentStyle[attr]; }else{ returngetComputedStyle(obj,false)[attr]; } } functionmove(obj,json,num,fn){ vartimer=null,attr=null;iCur=null,iTarget=null,iSpeed=null; clearInterval(obj.timer); obj.timer=setInterval(function(){ varonOff=true; for(attrinjson){ iTarget=json[attr]; iTarget=parseInt(iTarget); if(attr=="opacity"){ iCur=parseInt(parseFloat(getStyle(obj,attr)*100)); if(isNaN(iCur)){ iCur=100; } }else{ iCur=parseInt(getStyle(obj,attr)); } if(iCur<iTarget){ iSpeed=Math.ceil((iTarget-iCur)/num); }else{ iSpeed=Math.floor((iTarget-iCur)/num); } if(iCur!=iTarget){ onOff=false; if(attr=="opacity"){ obj.style[attr]=(iCur+iSpeed)/100; obj.style.filter="alpha(opacity=iCur+iSpeed)"; }else{ obj.style[attr]=iCur+iSpeed+"px"; if(Math.abs(iSpeed)>Math.abs(iTarget-iCur)){ obj.style[attr]=iTarget+"px"; } } } } if(onOff){ clearInterval(obj.timer); fn&&fn.call(obj); } },30); }