首页
所有分类
TAGS
文字工具 EMOJI BIBLE
编程 Javascript

原生JS实现网络彩票投注效果

Posted in Javascript onSeptember 25, 2016

个人游戏之作，小伙伴们研究下就好

主要功能：

1、可自由选择投注模式、倍数，可点击‘×'删除提交注单。
2、可使用jsonp引用官方彩票开奖数据（实时开奖）。
3、结合后台可实现官彩同样的效果。

实现原理：

单纯使用Js实现，这里主要用数组存放数据，随机生成开奖号码，然后进行判断是否中奖。

下面是完整JS代码：

index.html

<!doctype html>
<html lang="en">
 <head>
 <meta charset="UTF-8">
 <meta name="Generator" content="EditPlus®">
 <meta name="Author" content="">
 <meta name="Keywords" content="">
 <meta name="Description" content="">
 <title>彩票--德芙</title>
 <link rel="stylesheet" type='text/css' href="css/index.css" />
 <script type="text/javascript" src='js/sports-1.0-js.js'></script>
 </head>
 <body>
 <div id='Game'>
 <div class='G_top'>
 <div class="G_t_title">
  <h1 class='G_t_t_logo'>TanZhouCaiPiao</h1>
  <p class='text'>付出不亚于任何人的努力！</p>
 </div>
 <div class='G_t_kaijiang'>
  <p class='G_t_k_title'>潭州彩票<span class='G_t_k_t_issue' id='G_t_k_t_issue'></span>期</p>
  <div class='G_t_k_num' id='G_t_k_num'>
  <span></span>
  <span></span>
  <span></span>
  <span></span>
  <span></span>
  </div>
 </div>
 <div class="G_t_user">
  <div class='G_t_u_name'>德芙纵享丝滑</div>
  <div class='G_t_u_buy'>
  ￥
  <span class='G_t_u_money' id='G_t_u_money'>1314.51</span>
  </div>
  <div class='supMoney' id='supMoney'>
  </div>
  <div class='addMoney' id='addMoney'>
  </div>
 </div>
 </div>
 <div id="content">
 <div class='c_left'>
  <div class='c_l_mode' id='c_l_mode'>
  <span class='c_l_m_first'>三星</span>
  <span>定位胆</span>
  <span>大小单双</span>
  </div>
  <div class="c_l_shuoming">
  <div class="c_l_s_right" id='c_l_s_right'>
   <a href="javascript:void(0)">选号规则
   <div class='c_l_s_r_hide'>
   </div>
   </a>
   <a href="javascript:void(0)">中奖说明
   <div class='c_l_s_r_hide'>
   </div>
   </a>
   <a href="javascript:void(0)">投注案例
   <div class='c_l_s_r_hide'>
    
   </div>
   </a>
  </div>
  </div>
  <div class='c_l_number' id='c_l_number'>
  </div>
  <div class='c_l_bottom'>
  <div class='c_l_b_function'>
   <span class="c_l_b_f_sup"></span>
   <input type="text" class='c_l_b_f_beishu' id='c_l_b_f_beishu' value='1'/>
   <span class="c_l_b_f_add"></span>
   <i>倍</i>
   <select name="sel_mode" id="sel_mode" class="c_l_b_f_sel">
   <option value="1">元</option>
   <option value="2">角</option>
   <option value="3">分</option>
   </select>
   <p class='c_l_b_f_jiangjin'>奖金：<span id='jiangjin'>1800</span></p>
   <p class="c_l_b_f_data">选择<span class='c_l_b_f_d_num' id='zhushu'>0</span>注，共 ￥ <span class='c_l_b_f_d_num' id='money'>0</span>元</p>
  </div>
  <div class='c_l_b_submit'>
   <input type="submit" value='添加号码' id='c_l_b_s_addNum'/>
  </div>
  <input type="button" value='提交注单' id='c_l_b_deledNum' class='c_l_b_deledNum'/>
  </div>
  <textarea id='c_l_data' class='c_l_data' readonly></textarea>
 </div>
 <div class='c_right'>
  <div class="c_r_rus">
  <div class="c_r_r_qihao">开奖期号</div>
  <div class="c_r_r_haoma">开奖号码</div>
  <ul id='c_r_r_box'>
  </ul>
  </table>
  </div>
  <div class="c_r_list">
  <div class="c_r_l_title">
   <span>玩法</span>
   <span>注数</span>
   <span>倍数</span>
   <span>金额</span>
   <span class='close'></span>
  </div>
  <ul id='c_r_l_ul'>
  </ul>
  </div>
  <div class="c_r_touzhu">
  <input type="button" value='立即投注' id='c_r_t_btn' class='c_r_t_btn'/>
  </div>
 </div>
 </div>
 </div>
 <div class='explain'>
 <h2>介绍说明</h2>
 <div id='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>
 <script type="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:'Microsoft yahei';
}
.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:0 auto;
 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-repeat center 0;
 bottom:0;
}
.close{
 background: url(../img/arrow.png) no-repeat center -40px;
 bottom:-18px;
}
.explain h2{
 text-align:center;
}
.explain p{
 margin:5px;
}
.explain p span{
 color:#ffff33;
 margin-right:10px;
}
#Game{
 width:1000px;
 height:500px;
 margin:50px auto 200px;
}
#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: 0 0 1px currentColor,1px 1px 1px rgba(50,93,164,0.8),2px 2px 3px rgba(50,93,164,0.8),3px 3px 4px rgba(50,93,164,0.8),4px 4px 5px rgba(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: 0 0 1px currentColor, 2px 0 1px #083058, 0 2px 1px rgba(41,76,138,0.8), 2px 1px 1px #083058, 1px 2px 1px #98c0e8, 2px 2px 1px #487098, 3px 1px 1px #083058, 1px 3px 1px rgba(41,76,138,0.8), 3px 2px 1px #083058, 2px 3px 1px rgba(41,76,138,0.8), 3px 3px 1px #487098, 4px 2px 1px #083058, 2px 4px 1px rgba(41,76,138,0.8), 4px 3px 1px #083058, 3px 4px 1px rgba(41,76,138,0.8), 4px 4px 1px #487098, 5px 3px 1px #083058, 3px 5px 1px #98c0e8, 5px 4px 1px #083058, 4px 5px 1px rgba(41,76,138,0.8), 5px 5px 1px #487098, 6px 4px 1px #083058, 4px 6px 1px rgba(41,76,138,0.8), 6px 5px 1px #083058, 5px 6px 1px rgba(41,76,138,0.8), 6px 6px 1px #487098, 7px 5px 1px #083058, 5px 7px 1px #98c0e8, 7px 6px 1px #083058, 6px 7px 1px #98c0e8, 7px 7px 1px #487098, 8px 6px 1px #083058, 6px 8px 1px #98c0e8, 8px 7px 1px #083058, 7px 8px 1px #98c0e8, 8px 8px 1px #487098, 9px 7px 1px #083058, 7px 9px 1px #98c0e8, 9px 8px 1px #083058, 8px 9px 1px #98c0e8, 9px 9px 1px #487098, 10px 8px 1px #083058, 8px 10px 1px #98c0e8, 10px 9px 1px #083058, 9px 10px 1px #98c0e8, 10px 10px 1px #487098, 11px 9px 1px #083058, 9px 11px 1px #98c0e8, 11px 10px 1px #083058, 10px 11px 1px #98c0e8, 11px 11px 1px #487098, 11px 11px 1px #666, 11px 12px 1px #666, 10px 12px 1px #666, 9px 12px 1px #666, 8px 11px 1px #666, 7px 10px 1px #666, 6px 9px 1px #666, 5px 8px 1px #666, 4px 7px 1px #666, 3px 6px 1px #666, 2px 5px 1px #666, 1px 4px 1px #666, 0 3px 1px #666, -1px 2px 1px #666, 20px 8px 8px rgba(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: 0 0 1px currentColor,-1px -1px 1px #003,0 -1px 1px #003,1px -1px 1px #003,1px 0 1px #003,1px 1px 1px #003,0 1px 1px #003,-1px 1px 1px #003,-1px 0 1px #003;
}
h1:after {
  color: rgba(40,80,120,.1);
  text-shadow: 1px -1px 1px rgba(40,80,120,.8),-1px 1px 1px rgba(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:0 5px;
 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_num span{
 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_num span.kaijiang{
 background:url('../img/mv.gif');
 background-position: '0px 0px';
}
#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:2px 10px 2px 0px;
 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_left span.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:11px 10px 11px 0px;
}
#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:0 10px;
}
#content .c_left .c_l_number ul{
 width:660px;
 height:50px;
}
#content .c_left .c_l_number ul: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_number ul li{
 float:left;
 width:43px;
 height:43px;
 border-radius:50%;
 line-height:43px;
 color:#fff;
 text-align:center;
 cursor:pointer;
 margin:3px 5px 4px 0px;
 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_function i{
 float:left;
 margin:0 5px;
}
#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:5px 20px;
 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_jiangjin span{
 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:0 5px;
 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:'Microsoft yahei';
 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:'Microsoft yahei';
 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:5px 10px;
 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_rus ul{
 width:100%;
 position:absolute;
 top:30px;left:0;
 color:#fff;
}
#content .c_right .c_r_rus ul li{
 height:30px;
 width:100%;
}
#content .c_right .c_r_rus ul li span{
 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:20px auto;
 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_title span{
 display:inline-block;
 width:60px;
 text-align:center;
 line-height:20px;
 color:#ff6700;
}
#content .c_right .c_r_list ul li{
 width:100%;
 height:20px;
}
#content .c_right .c_r_list ul li span{
 display:inline-block;
 width:60px;
 text-align:center;
 line-height:20px;
 margin-right:4px;
}
#content .c_right .c_r_list ul li span.list_close{
 width:20px;
 height:20px;
 text-align:right;
 cursor:pointer;
 color:#ff6700;
}
#content .c_right .c_r_l_title span.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_touzhu span{
 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:15px 0;
}*/
#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:'Microsoft yahei';
 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(){
 var toggleMove=document.getElementById('toggleMove');
 var toggleOff=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;
 }
 }
}
var Game={
 '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(){
 var oMode=document.getElementById('c_l_mode').getElementsByTagName('span');
 var jiangjin=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 (var i=0;i < oMode.length;i++)
 {
  oMode[i].index=i;
  oMode[i].onclick=function(){
  Game.step=this.index;
  for (var j=0;j < oMode.length;j++)
  {
   oMode[j].className='';
  }
  this.className='c_l_m_first';
  switch(this.index){
   case 0:
   Game.addInitCase1();
   jiangjin.innerHTML='1800';
   break;
   case 1:
   Game.addInitCase1();
   jiangjin.innerHTML='18';
   break;
   case 2:
   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 (var i=0;i < this.alignArr.length ;i++ )
 {
  var oNum_ul=document.createElement('ul');
  var oNum_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 (var j=0; j < 10;j++ )
  {
  var oNum_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);
  }
  var oNum_ul_Rdiv=document.createElement('div');
  for (var z=0;z < this.btnArr.length ;z++ )
  {
   var oSpan=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='';
 var init1Arr=['大','小','单','双'];
 for (var i=0;i < this.alignArr.length-1;i++ )
 {
  var oNum_ul=document.createElement('ul');
  var oNum_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 (var j=0; j < init1Arr.length;j++ )
  {
  var oNum_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);
  }
  var oNum_ul_Rdiv=document.createElement('div');
  var oSpan=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){
 var oP=document.getElementById('c_l_s_right');
 var oHide=this.getClassName(oP,'c_l_s_r_hide');
 var data=[
   ['从百位、十位、个位各选一个号码组成一注。','从百位、十位、个位中选择一个3位数号码组成一注，所选号码与开奖号码后3位相同，且顺序一致，即为中奖。','投注方案：345</br>开奖号码：345，即中后三直选。'],
   ['在百位、十位、个位任意位置上任意选择1个或1个以上号码。','从百位、十位、个位任意位置上至少选择1个以上号码，所选号码与相同位置上的开奖号码一致，即为中奖。','投注方案：百位 1</br>开奖号码：百位 1，即中定位胆百位。'],
   ['从百位、十位中的“大、小、单、双”中至少各选一个组成一注。','对百位和十位的“大（56789）小（01234）、单（13579）双（02468）”形态进行购买，所选号码的位置、形态与开奖号码的位置、形态相同，即为中奖。','投注方案：小双</br>开奖号码：百位与十位“小双”，即中前二大小单双。']
  ];
 for (var i=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 (var j=0;j< oHide.length ;j++)
  {
   oHide[j].style.display='none';
  }
  this.children[0].style.display='block';
  }
 }
 for (var i=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){
 var addBtn=document.getElementById('c_l_b_s_addNum');
 var oText=document.getElementById('c_l_data');
 var amount=document.getElementById('zhushu');
 var money=document.getElementById('money');
 var oInput=document.getElementById('c_l_b_f_beishu');
 var oUl=this.oNum.children;
 this.Data[step]=[];
 for (var i=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)){
   case 0:
   Game.amountX=Game.targetData.length
   amount.innerHTML=Game.amountX;
   oText.innerHTML=Game.targetData;
   break;
   case 1:
   Game.amountX=Game.targetData.length;
   amount.innerHTML=Game.amountX;
   for (var i=0;i < Game.targetData.length;i++ )
   {
    oText.innerHTML+=Game.targetData[i]+'n';
   }
   break;
   case 2:
   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('请选择正确的投注方式!');
  }
  /**************************/
 }
 function addNum(Data){
  var n=parseInt(Data[Data.length-1]);
  switch(n){
  case 0:
   return getResultOne(Data[n]);
   break;
  case 1:
   return getResultTwo(Data[n]);
   break;
  case 2:
   return getResultThree(Data[n]);
   break;
  }
 }
 function getResultOne(Arr){
  var newArr=[];
  if(Arr[0].length > 0 && Arr[1].length > 0 && Arr[2].length > 0){
  for (var i=0;i < Arr[0].length;i++ )
  {
   for (var j=0;j< Arr[1].length;j++ )
   {
   for (var z=0;z< Arr[2].length;z++ )
   {
    newArr.push(Arr[0][i]+''+Arr[1][j]+''+Arr[2][z]);
   }
   }
  }
  newArr.sort(function(a,b){
   return a-b;
  });
  return newArr;
  }else{
  return false;
  }
 }
 function getResultTwo(Arr){
  var strArr=['百位','十位','个位'];
  var newArr=[];
  for (var i=0;i < Arr.length ;i++ )
  {
  if(Arr[i].length){
   for (var j=0;j < Arr[i].length ;j++ )
   {
   newArr.push(strArr[i]+' :  '+Arr[i][j])
   }
  }else{
   continue;
  }
  }
  return newArr;
 }
 function getResultThree(Arr){
  var newArr=[];
  if(Arr[0].length > 0 && Arr[1].length > 0 ){
  for (var i=0;i < Arr[0].length;i++ )
  {
   for (var j=0;j< Arr[1].length;j++ )
   {
   newArr.push(Arr[0][i]+''+Arr[1][j]);
   }
  }
  newArr.sort(function(a,b){
   return a-b;
  });
  return newArr;
  }else{
  return false;
  }
 }
 },
 'select':function(obj,arr){
 var oText=document.getElementById('c_l_data');
 var three=['大','小','单','双'];
 for (var i=0;i<obj.length;i++ )
 {
  obj[i].index=i;
  obj[i].off=true;
  obj[i].onclick=function(){
  var oSpan=this.parentNode.getElementsByTagName('span');
  for (var i=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 (var j=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(){
 var oSpan,num;
 var controlDiv=this.getClassName(this.oNum,'c_l_n_btn');
 for (var i=0;i < controlDiv.length;i++ )
 {
  controlDiv[i].index=i;
  oSpan=this.getClassName(controlDiv[i],'span'+i);
  for (var j=0;j < oSpan.length ;j++ )
  {
  oSpan[j].index=j
  oSpan[j].onclick=function(){
   num=this.parentNode.index;
   Game.Data[Game.step][num].length=0;
   var oParent=this.parentNode.parentNode;
   var oLi=oParent.getElementsByTagName('li');
   for (var z=0;z < oLi.length ;z++ )
   {
   oLi[z].style.backgroundPosition='-46px -57px';
   oLi[z].off = true;
   }
   if(Game.step != 2){
   var siblings=this.parentNode.children;
   for (var z=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){
 var half=parseInt(oLi.length/2);
 for (var i=0;i < oLi.length ;i++ )
 {
  switch(index)
  {
  case 0:
   oLi[i].style.backgroundPosition='-2px -57px';
   oLi[i].off = false;
   Game.Data[Game.step][num].push(i);
  break;
  case 1:
   if(i > half-1){
   oLi[i].style.backgroundPosition='-2px -57px';
   oLi[i].off = false;
   Game.Data[Game.step][num].push(i);
   }
  break;
  case 2:
   if(i < half){
   oLi[i].style.backgroundPosition='-2px -57px';
   oLi[i].off = false;
   Game.Data[Game.step][num].push(i);
   }
  break;
  case 3:
   var n=(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;
  case 4:
   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;
  case 5:
   oLi[i].style.backgroundPosition='-46px -57px';
   oLi[i].off = true;
   Game.Data[Game.step][num].length=0;
  break;
  }
 }
 },
 //倍数Input
 'controlInput':function(amountX){
 var money=document.getElementById('money');
 var oInput=document.getElementById('c_l_b_f_beishu');
 var oBtn=oInput.parentNode.getElementsByTagName('span');
 for (var i=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(){
 var oInput=document.getElementById('c_l_b_f_beishu');
 var money=document.getElementById('money');
 var oMode=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(){
 var oDiv=document.getElementById('c_l_number');
 var emptyBtn=document.getElementById('c_l_b_deledNum');
 var oText=document.getElementById('c_l_data');
 var money=document.getElementById('money');
 var amount=document.getElementById('zhushu');
 var listUl=document.getElementById('c_r_l_ul');
 var oInput=document.getElementById('c_l_b_f_beishu');
 var oMode=document.getElementById('sel_mode');
 var jiangjin=document.getElementById('jiangjin');
 var arr=['三星直选','定位胆','大小单双'];
 emptyBtn.onclick=function(){
  if(parseInt(money.innerHTML*999)){
  var json={a:jiangjin.innerHTML,b:amount.innerHTML,c:oInput.value,d:money.innerHTML,e:Game.targetData,f:Game.num};
  Game.OrderArr.push(json);
  var oLi=document.createElement('li');
   oLi.innerHTML='<span data-step="'+Game.wanfa+'">'+arr[Game.wanfa]+'</span><span>'+amount.innerHTML+'</span><span>'+oInput.value+'</span><span>'+money.innerHTML+'</span><span class="list_close">×</span>';
  listUl.appendChild(oLi);
  /************************************************************/
  oDiv.innerHTML='';
  oText.innerHTML='';
  money.innerHTML='0';
  amount.innerHTML='0';
  switch(parseInt(Game.step)){
   case 0:
   Game.addInitCase1();
   break;
   case 1:
   Game.addInitCase1();
   break;
   case 2:
   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(){
 var oUl=document.getElementById('c_r_l_ul');
 var closeBtn=this.getClassName(oUl,'list_close');
 for (var i=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(){
 var supMoney=document.getElementById('supMoney');
 var oPushBtn=document.getElementById('c_r_t_btn');
 oPushBtn.onclick=function(){
  var money=0;
  var pM=Game.personMon.innerHTML;
  if(Game.OrderArr.length){
  for (var i=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){
 var result=[];
 var off=false;
 var oSpan=document.getElementById('G_t_k_num').children;
 var listUl=document.getElementById('c_r_l_ul');
 for (var i= listUl.children.length-1 ;i >= 0; i-- )
 {
  listUl.children[i].parentNode.removeChild(listUl.children[i]);
 }

 for (var i=0;i < oSpan.length ;i++ )
 {
  oSpan[i].className='kaijiang';
  oSpan[i].style.transitionDelay='0s';
 }
 setTimeout(function(){
  for (var i=0;i < oSpan.length ;i++ )
  {
  var n=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];
  }
  return callback(result);
 },1500);
 },
 'getAward':function(res){
 var issue=document.getElementById('G_t_k_t_issue');
 var oBox=document.getElementById('c_r_r_box');
 issue.innerHTML=addZero(Game.qishu);
 if(oBox.children.length == 5){
  var removeObj=oBox.children[4];
  removeObj.parentNode.removeChild(removeObj);
 }
 var oLi=document.createElement('li');
  oLi.innerHTML='<span class="qishu">'+addZero(Game.qishu)+'</span><span class="haoma">'+res+'</span>';
 if(oBox.children.length){
  oBox.insertBefore(oLi , oBox.children[0])
 }else{
  oBox.appendChild(oLi);
 }
 function addZero(a){
  a++;
  if(a < 10){
  return '00'+a;
  }else if(a < 100){
  return '0'+a;
  }else{
  return ''+a;
  }
 }
 Game.qishu++;
 Game.setMoney(res);
 Game.targetData.length=0;
 },
 'setMoney':function(res){
 var addMoney=document.getElementById('addMoney');
 var regB=/百位/,regS=/十位/,regG=/个位/;
 var bArr=[],sArr=[],gArr=[];
 var san=res[2]+""+res[3]+""+res[4];
 var arr=[];
 arr.push(((res[2]%2?'单':'双') + (res[3]%2?'单':'双')));
 arr.push(((res[2]>4?'大':'小') + (res[3]%2?'单':'双')));
 arr.push(((res[2]>4?'大':'小') + (res[3]>4?'大':'小')));
 var moneyAward=0;
 var n=null;
 for (var i=0;i < this.OrderArr.length ;i++ )
 {
  n=this.OrderArr[i]
  switch(n.a){
  case '1800':
   for (var z=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':
   var k=0;
   for (var z=0;z < n.e.length ;z++ )
   {
   if( regB.test(n.e[z]) ){
    if( new RegExp(res[2]).test(n.e[z]) )
    {
    k++;
    continue;
    }
   }else if( regS.test(n.e[z]) ){
    if( new RegExp(res[3]).test(n.e[z]) )
    {
    k++;
    continue;
    }
   }else if( regG.test(n.e[z]) ){
    if( new RegExp(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':
   //中奖注数初始值
   var j=0;
   for (var z=0;z < n.e.length;z++ )
   {
   for(var x=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){
  var obj= obj || document;
  if(obj.getElementsByClassName)
  {
   return obj.getElementsByClassName(cName);
  }else{
   var arr=[];
   var allE=obj.getElementsByTagName('*');
   for (var i=0;i<allE.length;i++ )
   {
    var allElements=allE[i].className.split(' ');
    for (var j=0;j<allElements.length;j++)
    {
   if(allElements[j].className==cName)
   {
    arr.push(allE[i]);
    break;
   }
    }
   }
   return arr;
  }
 },
 'count':{
 //乘
 'accMul':function(a,b) 
 { 
  var m=0,s1=a.toString(),s2=b.toString(); 
  try{m+=s1.split(".")[1].length}catch(e){} 
  try{m+=s2.split(".")[1].length}catch(e){} 
  return Number(s1.replace(".",""))*Number(s2.replace(".",""))/Math.pow(10,m) 
 },
 //除
 'accDiv':function(a,b){ 
  var t1=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){ 
  var r1,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){
  var r1,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

function getStyle(obj,attr){
	if(obj.currentStyle){
		return obj.currentStyle[attr];
	}else{
		return getComputedStyle(obj,false)[attr];
	}
}
function move(obj,json,num,fn){
	var timer=null,attr=null;iCur=null,iTarget=null,iSpeed=null;
	clearInterval(obj.timer);
	obj.timer=setInterval(function(){
		var onOff=true;
		for(attr in json){
			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);
}

原生JS实现网络彩票投注效果

- Author -

thomspon

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

Javascript 相关文章推荐
js获取div高度的代码
Aug 09 Javascript
复制小说文本时出现的随机乱码的去除方法
Sep 07 Javascript
遍历jquery对象的代码分享
Nov 02 Javascript
javascript 使用 NodeList需要注意的问题
Mar 04 Javascript
jQuery实现单行文字间歇向上滚动源代码
Jun 02 Javascript
使用jQuery解决IE与FireFox下createElement方法的差异
Nov 14 Javascript
javascript动态添加、修改、删除对象的属性与方法详解
Jan 27 Javascript
jQuery中hover与mouseover和mouseout的区别分析
Dec 24 Javascript
JS面向对象编程详解
Mar 06 Javascript
BootStrapValidator校验方式
Dec 19 Javascript
微信小程序http连接访问解决方案的示例
Nov 05 Javascript
JS实现选项卡插件的两种写法（jQuery和class）
Dec 30 jQuery
JavaScript实现url参数转成json形式
Sep 25 #Javascript
动态JavaScript所造成一些你不知道的危害
Sep 25 #Javascript
jQuery中的AjaxSubmit使用讲解
Sep 25 #Javascript
需要牢记的JavaScript基础知识
Sep 25 #Javascript
分享一个原生的JavaScript拖动方法
Sep 25 #Javascript
HTML中setCapture、releaseCapture 使用方法浅析
Sep 25 #Javascript
jQuery的deferred对象使用详解
Sep 25 #Javascript
英国购物网站(954) 巴西购物网站(71) 香港购物网站(84) 爱尔兰购物网站(30) 天梯图(1) 美国购物网站(1542) 加拿大购物网站(185) 中国购物网站(172) 新加坡购物网站(41) SLi Minor 2020(63)
You might like
ASP知识讲座四
2006/10/09 PHP
BBS(php &amp; mysql)完整版(七)
2006/10/09 PHP
使ecshop模板中可引用常量的实现方法
2011/06/02 PHP
如何在PHP中使用正则表达式进行查找替换
2013/06/13 PHP
PHP中的替代语法介绍
2015/01/09 PHP
PHP实现抓取迅雷VIP账号的方法
2015/07/30 PHP
PHP Yaf框架的简单安装使用教程(推荐)
2016/06/08 PHP
php语法检查的方法总结
2019/01/21 PHP
PDO::inTransaction讲解
2019/01/28 PHP
15条JavaScript最佳实践小结
2013/08/09 Javascript
JavaScript二维数组实现的省市联动菜单
2014/05/08 Javascript
JavaScript使用DeviceOne开发实战（一) 配置和起步
2015/12/01 Javascript
谈谈我对JavaScript原型和闭包系列理解(随手笔记9)
2015/12/24 Javascript
JavaScript中Window对象的属性及事件
2015/12/25 Javascript
Angular4开发解决跨域问题详解
2017/08/28 Javascript
详解vue-cli中的ESlint配置文件eslintrc.js
2017/09/25 Javascript
Bootstrap 树控件使用经验分享(图文解说)
2017/11/06 Javascript
如何实现一个webpack模块解析器
2018/10/24 Javascript
JS对日期操作封装代码实例
2019/11/08 Javascript
详解ES6 CLASS在微信小程序中的应用实例
2020/04/24 Javascript
VUE+Element实现增删改查的示例源码
2020/11/23 Vue.js
python 根据时间来生成唯一的字符串方法
2019/01/14 Python
详解Python中is和==的区别
2019/03/21 Python
python实现日志按天分割
2019/07/22 Python
对python中return与yield的区别详解
2020/03/12 Python
社区版pycharm创建django项目的方法(pycharm的newproject左侧没有项目选项)
2020/09/23 Python
Hawes & Curtis澳大利亚官网：英国经典服饰品牌
2018/10/29 全球购物
韩语专业本科生求职信
2013/10/01 职场文书
驾驶员岗位职责
2014/01/29 职场文书
学校安全责任书范本
2014/07/23 职场文书
公司领导班子对照检查存在问题整改措施
2014/10/02 职场文书
小学运动会报道稿
2014/10/04 职场文书
财务务虚会发言材料
2014/10/20 职场文书
企业介绍信范文
2015/01/30 职场文书
css3实现背景图片半透明内容不透明的方法示例
2021/04/13 HTML / CSS
关于ObjectUtils.isEmpty() 和 null 的区别
2022/02/28 Java/Android