js实现网页抽奖实例
更新时间：2015年08月05日 17:46:06 作者：皮蛋
这篇文章主要介绍了js实现网页抽奖的方法,实例分析了javascript随机数及时间函数的相关使用技巧,非常简单实用,需要的朋友可以参考下
本文实例讲述了js实现网页抽奖的方法。分享给大家供大家参考。具体如下：
这段网页抽奖程序，基于javascript代码实现，简单的演示如何使用JS来实现抽奖功能，点击“开始抽奖”按钮，程序即开始抽奖了，需要停止的时候按“停止”，以前发过类似的抽奖程序有几个了，有兴趣的自己在本站网页特效栏目搜索“抽奖”看下。
运行效果如下图所示：
具体代码如下：
<!DOCTYPE html>
<html lang="zh">
<head>
<title>抽奖程序</title>
<script type="text/javascript">
var randNum=Math.random()*10;
function testTime(){
document.getElementById("testtime").innerHTML="<h2>"+Math.floor(Math.random()*10)+"</h2>";
}
function setTime(mark){
timer=null;
timer=setInterval(testTime,12);
if(mark=='stop'){
clearInterval(timer);
}
return timer;
}
function clearTime(timer){ }
</script>
<style type="text/css">
<!--
body {font-family: Arial;color:#fff;margin: 0px;padding: 0px;background:#000;text-align:center;}
#happyness{font-size:186px;line-height:186px;margin-top:100px;}
-->
</style>
</head>
<body>
</body>
<button onClick="timer=setInterval(testTime,12);" value="" style="width:100px;height:30px">开始抽奖</button>
<button onClick="clearInterval(timer);" value="Stop" style="width:100px;height:30px">停止</button>
<div id="testtime" style="font-size:25px"></div>
</html>
希望本文所述对大家的javascript程序设计有所帮助。
相关文章
本篇文章主要介绍了原生js实现轮播图的示例代码，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧2017-02-02
屏蔽右键在某些特殊的情况下还是比较有用的，下面与大家分享个常用的屏蔽方法2014-05-05
下面小编就为大家带来一篇数据结构中的各种排序方法小结(JS实现)。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧2016-07-07
将文本内容转译成加密文本，在某些情况下还是比较实用的，下面通过js简单实现下，感兴趣的朋友不要错过2013-10-10
这篇文章主要为大家详细介绍了基于MVC方式实现三级联动的相关资料，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2017-01-01
这篇文章主要为大家详细介绍了如何利用JavaScript实现检测用户是否在线功能，文中的示例代码讲解详细，感兴趣的小伙伴可以跟随小编一起学习一下2022-12-12
最近没有项目做，闲来没事，于是自己动手写了几个表单验证，特此分享供大家参考2015-11-11
断点调试是啥?难不难? 断点调试其实并不是多么复杂的一件事,简单的理解无外呼就是打开浏览器,打开sources找到js文件,在行号上点一下罢了,下面这篇文章主要给大家介绍了关于JS中6种打断点方式的相关资料,需要的朋友可以参考下2022-04-04
这篇文章主要介绍了js 计数排序的实现示例(升级版),文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2020-01-01
js实现响应按钮点击弹出可拖拽的非模态对话框完整实例【测试可用】
这篇文章主要介绍了js实现响应按钮点击弹出可拖拽的非模态对话框,结合完整实例形式分析了原生JavaScript实现的可拖拽非模态对话框实现技巧与使用方法,需要的朋友可以参考下2023-04-04
最新评论