欢迎来到代码驿站!

jquery

当前位置:首页 > 网页前端 > jquery

jquery 年会抽奖程序

时间:2021-01-09 11:16:43|栏目:jquery|点击:
看了一下,传不了源代码,特粘帖html
复制代码 代码如下:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<link href="Content/myPub.css" rel="stylesheet" type="text/css" />
<script src="Scripts/js/xfc.js" type="text/javascript"></script>
<script src="http://demo.jb51.net/jslib/jquery/jquery-1.6.2.min.js" type="text/javascript"></script>
<!-- 导航切换 -->
<style type="text/css">
.center
{
text-align: center;
height: auto;
}
.center span
{
font-size: 50px;
font-weight: 900;
line-height: 50px;
}
.center img
{
width: 1200px;
height: 580px;
}
.s_chg
{
float: left;
width: 1240px;
height: auto;
margin-left:40px;
}
.s_chg img
{
width: 240px;
height: 120px;
padding-top:10px;
}
.s_title
{
color:Red;
font-size :35px;
font-weight:bold;
}
</style>
</head>
<body>
<div class="w center hide ">
<span id="chg" atg="0" >1</span>
</div>
<div class="w center" id="i_div">
<img id="chg_img" onclick="chg()" src="Content/images/JPEG/1 (1).jpg" />
</div>
<div class="w " >
<br/>
<button onclick ="wshow(0)">查看全部获奖</button>
<button onclick ="wshow(1)">查看一等奖获奖</button>
<button onclick ="wshow(2)">查看二等奖获奖</button>
<button onclick ="wshow(3)">查看三等奖获奖</button>
<button onclick ="sshow()">开始抽奖</button></div>
<div class="w s_chg" id="s_div">
</div>
<script language="javascript" type="text/javascript">
var time = 0;
var th = 9;
var two = 5;
var f =1;
var max = 122;
var t;
var zhong = new Array();
function sshow() {
$("#i_div").show();
$("#s_div").hide();
}
function wshow(e) {
var s_sum;
switch (e) {
case 0:
s_sum = th + two + f;
break;
case 1:
s_sum = th + two + f;
break;
case 2:
s_sum = th + two;
break;
case 3:
s_sum = th;
break;
}
if (zhong.length < s_sum) {
var cha = (s_sum) - (zhong.length);
alert("名额还差 "+cha.toString()+" 名");
return;
}
$("#i_div").hide();
$("#s_div").show();
var sdiv = $("#s_div");
sdiv.children().remove();
if (e == 0 || e == 3) {
var html = "<br/><br/><br/><span class='s_title'>三等奖</span><br/><br/><br/>";
sdiv.prepend(html);
for (var i = 0; i < th; i++) {
html = " <img src='Content/images/JPEG/1 (" + zhong[i] + ").jpg' /> ";
sdiv.prepend(html);
}
}
if (e == 0 || e == 2) {
html = "<br/><br/><br/><span class='s_title'>二等奖</span><br/><br/><br/>";
sdiv.prepend(html);
for (var i = (th); i < (th + two); i++) {
html = " <img src='Content/images/JPEG/1 (" + zhong[i] + ").jpg' /> ";
sdiv.prepend(html);
}
}
if (e == 0 || e == 1) {
html = "<br/><br/><br/><span class='s_title'>一等奖</span><br/><br/><br/>";
sdiv.prepend(html);
for (var i = (th + two); i < (th + two + f); i++) {
html = " <img src='Content/images/JPEG/1 (" + zhong[i] + ").jpg' /> ";
sdiv.prepend(html);
}
}
}
function addtime() {
if (time == max)
time =0;
time=time+1;
$("#chg").html(time);
$("#chg_img").attr("src", "Content/images/JPEG/1 (" +time+ ").jpg");
t = setTimeout("addtime()", 20);
}
function stoptime() {
clearTimeout(t);
while (chkzhong() == 1) {
}
zhong.push(time);
$("#chg_img").attr("src", "Content/images/JPEG/1 (" + time + ").jpg");
}
function chg() {
if (zhong.length == (th + two + f)) {
alert("抽奖名额已全,请查看");
return;
}
if ($("#chg").attr("atg") == "0") {
$("#chg").attr("atg", "1");
addtime();
} else {
$("#chg").attr("atg", "0");
stoptime();
if (zhong.length == (th )) {
alert("三等奖已经抽完 ");
return;
}
if (zhong.length == (th + two )) {
alert("二等奖已经抽完 ");
return;
}
if (zhong.length == (th + two + f )) {
alert("一等奖已经抽完");
return;
}
}
}
function chkzhong() {
for (var it in zhong) {
if (it == time) {
if (time == max)
time=0
time = time + 1;
return 1;
} else {
return 0;
}
}
}
</script>
</body>
</html>

上一篇:跟着JQuery API学Jquery 之二 属性

栏    目:jquery

下一篇:jquery访问ashx文件示例代码

本文标题:jquery 年会抽奖程序

本文地址:http://www.codeinn.net/misctech/42886.html

推荐教程

广告投放 | 联系我们 | 版权申明

重要申明:本站所有的文章、图片、评论等,均由网友发表或上传并维护或收集自网络,属个人行为,与本站立场无关。

如果侵犯了您的权利,请与我们联系,我们将在24小时内进行处理、任何非本站因素导致的法律后果,本站均不负任何责任。

联系QQ:914707363 | 邮箱:codeinn#126.com(#换成@)

Copyright © 2020 代码驿站 版权所有