学自潭州学院视频
主程序页面截图
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>抽签系统</title> <style type="text/css">
.activity {
width: 600px;
height: 300px;
border: 1px solid;
margin: 150px auto;
} .text {
width: 600px;
height: 100px;
background: #379be9;
text-align: center;
line-height: 100px;
font-size: 28px;
color: white;
} body {
font-size: 12px;
font-family: "微软雅黑";
color: #666;
} .myform {
text-align: center;
margin: 10px;
} .a_value {
width: 200px;
height: 40px;
line-height: 40px;
font-size: 24px;
text-align: center;
margin-top: 40px;
margin-bottom: 30px
} .btn {
width: 100px;
height: 30px;
}
</style>
</head>
<body>
<!-- div层，盒子，容器 -->
<div class="activity">
<div class="text" id="myText">抽签系统</div>
<div class="myform">
<input type="text" class="a_value" id="myRandom"></br>
<input type="button" value="开始" class="btn" onclick="myStart()">
<input type="button" value="停止" class="btn" onclick="myStop()">
</div>
</div>
<!-- 动态脚本 -->
<script type="text/javascript">
//开始抽奖的方法
var timer = null;//定时器的变量
var data = "宿兵畅,尹博文,王悦雪,杜舟,康泽生,武凡,高梦轩,佘士耀,魏昭宇";//抽奖数据，以逗号分隔
//分拆抽奖的数据为数组
var arr = data.split(",");
function myStart() {
//开始之前清空文本框
document.getElementById("myRandom").value = "";
if (!timer) {
//创建定时器
timer = setInterval(function change(){
var max = arr.length - 1;//数组的长度
var rand = Math.random();//创建一个随机数，大于0
var randIndex = parseInt(rand * max);//得到整型数据
var text_val = document.getElementById("myText");//获取文本框区域的值
text_val.innerHTML = arr[randIndex];//文本框的值显示在页面
},50);//每50毫秒的间隔，更快的是数字变小
} } function myStop(){
clearInterval(timer);//清除定时器
timer = null;//变量定时器的清空
var myText = document.getElementById("myText");//获取变化区域的值
var myRandom = document.getElementById("myRandom");//获取文本框里面的值
myRandom.value = myText.innerHTML;//给文本框赋新值
}
</script>
</body>
</html>
主要代码