微信掃碼登錄 ×
隨機中獎名單抽獎源碼

隨機中獎名單抽獎源碼

收藏
隨機中獎名單抽獎源碼
jQuery基于json動態(tài)獲取中獎名單列表,隨機點名獲取抽獎用戶信息。這是一款適用于公司年會多個中獎名單批量抽獎源代碼。

使用方法:

1、head引入css文件

<link href="css/css.css" rel="stylesheet" type="text/css">

2、head引入js文件

<script type="text/javascript" src="js/jquery.min.js"></script>

3、body引入HTML代碼

<div class="box">
	<p class="Title">中獎名單顯示</p>
	<ul class="prizeList">

	</ul>
	<div class="submit" data-id="0">開 始</div>
</div>

<script type="text/javascript">
//從一個給定的數(shù)組arr中,隨機返回num個不重復(fù)項
		function getArrayItems(arr, num) {
		    //新建一個數(shù)組,將傳入的數(shù)組復(fù)制過來,用于運算,而不要直接操作傳入的數(shù)組;
		    var temp_array = new Array();
		    for (var index in arr) {
		        temp_array.push(arr[index]);
		    }
		    //取出的數(shù)值項,保存在此數(shù)組
		    var return_array = new Array();
		    for (var i = 0; i<num; i++) {
		        //判斷如果數(shù)組還有可以取出的元素,以防下標越界
		        if (temp_array.length>0) {
		            //在數(shù)組中產(chǎn)生一個隨機索引
		            var arrIndex = Math.floor(Math.random()*temp_array.length);
		            //將此隨機索引的對應(yīng)的數(shù)組元素值復(fù)制出來
		            return_array[i] = temp_array[arrIndex];
		            //然后刪掉此索引的數(shù)組元素,這時候temp_array變?yōu)樾碌臄?shù)組
		            temp_array.splice(arrIndex, 1);
		        } else {
		            //數(shù)組中數(shù)據(jù)項取完后,退出循環(huán),比如數(shù)組本來只有10項,但要求取出20項.
		            break;
		        }
		    }
		    return return_array;
		}
	var interval;
	$(".submit").click(function(){
		var status = $(this).data("id");
		var ints ;
		if(status == 0){
			$.get("data.json",{},function(data){
				if(data){
	      			if(data.code=="1"){
	        			function times(){
							var ArrList=data.data;
							var res = getArrayItems(ArrList,20);
							str='';
							for(o in res){
								num = parseInt(o)+1;
								str+='<li data-id="'+res[o].id+'">'+num+'、<span>'+res[o].name+'</span><label>'+res[o].tel+'</label></li>';
							}
							$(".prizeList").html(str);
						}
						interval = setInterval(times,0);
						$(".submit").data("id","1");
						$(".submit").text("停止");
		            }
		        }else{  
		            alert('Ajax error!');
		        }
		    },'json');
		}else{
			clearInterval(interval);
			$(".submit").data("id","0");
			$(".submit").text("開始");
		}
	})

</script>

使用聲明

1. 本站所有素材(未指定商用),僅限學(xué)習(xí)交流。
2. 會員在本站下載的原創(chuàng)商用和VIP素材后,只擁有使用權(quán),著作權(quán)歸原作者及17素材網(wǎng)所有。
3. 原創(chuàng)商用和VIP素材,未經(jīng)合法授權(quán),請勿用于商業(yè)用途,會員不得以任何形式發(fā)布、傳播、復(fù)制、轉(zhuǎn)售該素材,否則一律封號處理。
4. 本平臺織夢模板僅展示和個人非盈利用途,織夢系統(tǒng)商業(yè)用途請預(yù)先授權(quán)。

x
×
×

注冊

QQ注冊 立即下載 微信注冊 立即下載

簽到成功!

已連續(xù)簽到1天,連續(xù)簽到3天可獲得50積分

知道了