javaweb闲暇小程序之抽签程序
学自潭州学院视频
主程序页面截图

<%@ 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>
主要代码
javaweb闲暇小程序之抽签程序的更多相关文章
- 小程序5:FTP程序
目录 1.FTP程序所需要的知识点 2.FTP程序具体实现过程 2.1 FTP程序之注册功能 2.2 FTP程序之登录功能 2.3 FTP程序之下载功能 3.FTP程序源代码 FTP程序所需要的知识点 ...
- 改善C#程序,提高程序运行效率的50种方法
改善C#程序,提高程序运行效率的50种方法 转自:http://blog.sina.com.cn/s/blog_6f7a7fb501017p8a.html 一.用属性代替可访问的字段 1..NET ...
- 浅谈 Python 程序和 C 程序的整合
源地址:http://www.ibm.com/developerworks/cn/linux/l-cn-pythonandc/ 概览 Python 是一种用于快速开发软件的编程语言,它的语法比较简单, ...
- Web程序和应用程序服务器[转]
转自:http://hi.baidu.com/lclkathy/blog/item/dae3be36763a47370b55a970.html 一 常见的WEB服务器和应用服务器 在UNIX和LINU ...
- 谈 Python 程序和 C 程序的整合 (转载)
http://www.ibm.com/developerworks/cn/linux/l-cn-pythonandc/ 概览 Python 是一种用于快速开发软件的编程语言,它的语法比较简单,易于掌握 ...
- 好程序与差程序Good Programming, Bad Programming
好程序与差程序 Good Programming, Bad Programming 发布时间: 2012-11-20 16:32:21| 阅读数:2,735 views 优秀的程序可以使复杂的东西看起 ...
- 在网页程序或Java程序中调用接口实现短信猫收发短信的解决方案
方案特点: 在网页程序或Java程序中调用接口实现短信猫收发短信的解决方案,简化软件开发流程,减少各应用系统相同模块的重复开发工作,提高系统稳定性和可靠性. 基于HTTP协议的开发接口 使用特点在网页 ...
- java基础,继承类题目:编写一个Java应用程序,该程序包括3个类:Monkey类、People类和主类 E
21.编写一个Java应用程序,该程序包括3个类:Monkey类.People类和主类 E.要求: (1) Monkey类中有个构造方法:Monkey (String s),并且有个public vo ...
- oracle 未找到提供程序。该程序可能未正确安装
使用ADO连接oracle数据库时,连接串使用Provider=OraOLEDB.Oracle时提示"未找到提供程序.该程序可能未正确安装". 原因:由于我之间安装oracle_o ...
随机推荐
- 在多个平台如何安装Python
最近的一个项目,架构师米洛需要用的mqtt,服务器开发的时候,竟然用的python脚本.运行python就需要安装开发环境,好吧,百度一下就知道了大神廖雪峰.以下部分测试通过,转载记录如下. 因为Py ...
- 04.常量变量和数据类型(const)
1.关键字 2.数据类型 告诉编译器定义一个类型变量的空间! 3.常量 4.变量 在程序运行过程中,值可以改变 变量在使用前必须先定义,定义变量前必须有相应的数据类型 标识符命名规则: (1).标识符 ...
- 【Git】修改git远程连接ip
- 学习animate.css包含了一组炫酷、有趣、跨浏览器的动画
1.animate.css包含了一组炫酷.有趣.跨浏览器的动画,可以在你的项目中直接使用. 第一步:引入animate.css样式文件或者引入某些平台的CDN文件: <head> < ...
- encodeURIComponent 和 decodeURIComponent 对字符串url编码 用于url拼字符传值
- ESP8266开发笔记
自1999年MIT的Kevin Ash-ton教授首次提出物联网(IoT)的概念至今已经有20年了.放眼现在国内外的物联网市场,真可谓是百家争鸣,方兴未艾,无数家软硬件公司在这里舞浪弄潮,逐鹿其中,上 ...
- MATLAB关系运算符和逻辑运算符
1 关系运算符 关系运算符用来比较两个数之间的大小关系,在Matlab中的关系运算符包括: < 小于 <= 小于或等于 > 大于 >= 大于或等于 = ...
- idea没配置Tomcat容器报错及解决方法
servlet报错,提示没有一个容器,需要一个容器来运行,说明没有tomcat容器. 看看idea的配置有没有配置tomcat? 果然没有配置tomcat容器(正常画红框的地方会出现配置的tomcat ...
- mysql执行update语句受影响行数是0
mybatis连接mysql数据库,发现同一个update执行多次,返回的int值都是1. 我记得同样的update再次执行时 受影响行数是0. 后来发现,我之前一直用的SQLyog是这样子的. 原来 ...
- js常用的400个特效
JavaScript实现可以完全自由拖拽的效果,带三个范例 http://www.sharejs.com/showdetails-501.aspx javascript实现可以自由拖动的树形列 ...