帮助中心
获取牛币
联系我们
关于我们
版权声明
素材牛首页
微博登录
QQ登录
微信扫码登录
注册
登录
新浪微博
QQ登陆
微信登录
热门搜索：
小程序
支付
python
后台
商城
上传
Thinkphp
php视频
手机
微擎
Vue.js
首 页
网页特效
整站源码
PHP/MySql
网站模版
在线工具箱
常用代码
视频教程
论坛
游戏源码
当前位置：
首页
»
精选常用代码
» JQUERY实现可以进行多等奖项及多人抽奖结果的随机抽奖
JQUERY实现可以进行多等奖项及多人抽奖结果的随机抽奖
浏览：258次
-
评论：2次
-
发布时间：2019-09-05
Html
Css
Js
抽取
一等奖(1名)
二等奖(2名)
三等奖(3名)
开始
停止
一等奖得主：
二等奖得主：
三等奖得主：
*{margin:0;padding:0} body{font-size:12px} .result_xx dd,.result_xx dt{float:left;margin:10px} .xname{height:30px;margin:30px;font-size:20px;font-weight:700;color:#c50000}
$(function() { var auto; var arry; //声明储存姓名的数组； function funa() { arry = ["111", "222", "333", "444", "555", "666", "777", "888", "999", "aaa", "bbb", "ccc", "ddd", "eee", "fff"]; //定义一个数组，存放名字 var rand = Math.floor(Math.random() * arry.length); //随记取得数组的下标 $(".xname").text(arry[rand]); auto = setTimeout(funa, 100) } $(".beginclick").click(function() { auto = setTimeout(funa, 100) return false; }) var aleady; //存储已经选定的人名 $(".endclick").click(function() { clearTimeout(auto); var szname = $(".xname").text(); var jx = $(".jxsz")[0].options.selectedIndex; //获取选中的是哪一种奖项 var nowdd = $(".result_xx").eq(jx).find("dd"); var mm = nowdd.length; if (mm == jx + 1) { alert("此奖项人选已定！") } else { $(".result_xx").eq(jx).append("<dd>" + szname + "</dd>"); arry.splice($.inArray(szname, arry), 1); //删除已经选定的数组元素 } return false; }) })
↑上面代码改变，会自动显示代码结果
jQuery调用版本：
1.11.3
<!doctype html><html><head><meta charset="utf-8"><title>JQUERY实现可以进行多等奖项及多人抽奖结果的随机抽奖-www.sucainiu.com</title><script src="https://libs.baidu.com/jquery/1.11.3/jquery.min.js"></script><style>
</style></head><body>
<script>
</script>
</body></html>
立即下载
收藏
积分说明：注册即送15牛币，每日签到可获得5牛币，成为VIP会员可永久免积分下载！
充值积分
充值会员
更多说明»
代码描述：可以进行多个一二三等奖奖项及多人抽奖结果的随机抽奖特效 JS可以做多个奖项，比如一等奖一名，二等奖二名，三等奖三名，并且筛选数据，中过奖的人不再进行抽奖，可以用于公司活动上随机抽奖用。
JS可以做多个奖项，比如一等奖一名，二等奖二名，三等奖三名，并且筛选数据，中过奖的人不再进行抽奖，可以用于公司活动上随机抽奖用。
分享一个公司活动中使用员工人员姓名来进行随机抽奖的
精仿腾讯网页QQ空间的好友管理列表特效代码
讨论这个常用代码（2）
回答他人问题或分享心得会奖励牛币
Lv1 菜鸟
qq***71
2019年11月15日
这个挺不错的，学习一下O
回复
Lv7 码师
qq***43
2019年12月21日
签到的时间
回复
文明上网，理性发言！ 😉 阿里云幸运券，
戳我领取
发表评论
提交回复
我的积分余额：
0
已下载次数：
微博登录
QQ登录
微信扫码登录