简易的抽奖

最新推荐文章于 2022-03-08 08:00:00 发布

wuko.0

最新推荐文章于 2022-03-08 08:00:00 发布

阅读量179

点赞数 1

分类专栏： css js 文章标签： javascript css html

本文链接：https://blog.csdn.net/qq_40586654/article/details/81264235

版权

css 同时被 2 个专栏收录

8 篇文章 0 订阅

订阅专栏

7 篇文章 0 订阅

订阅专栏

<!doctype html>

<html>

<head>

<meta charset="utf-8">

<title>无标题文档</title>

<style>

#list{width:330px;}

#list li{

display:inline-block;

height:100px;

width:100px;

border:1px solid #000;

}

</style>

<script src="jquery-1.10.1.min.js"></script>

<script>

$(function(){

var num = 0;

$('button').click(function(){

var timer = null;

timer = setInterval(aaa,50)

function aaa(){

$('#list').find('li').css('background','').eq(num).css('background','#f00')

num++;

if(num>8){

num=0;

}

if(num==Math.round(Math.random()*9)){

clearInterval(timer)

}

}

//console.log(Math.floor(Math.random()*9))



})



})

</script>

</head>



<body>

<button>抽奖</button>

<ul id="list">

<li>1</li>

<li>2</li>

<li>3</li>

<li>4</li>

<li>5</li>

<li>6</li>

<li>7</li>

<li>8</li>

<li>9</li>

</ul>

<div></div>

</body>

</html>