一个简单的抽奖小案例

最新推荐文章于 2024-08-09 18:43:30 发布
最新推荐文章于 2024-08-09 18:43:30 发布
阅读量122 收藏
点赞数 1
文章标签： html jquery
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/mumudezhi/article/details/116902243
版权

                 一个简单的抽奖小案例

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

开发工具与关键技术：Visual Studio    HTML   CSS    Jq

撰写时间:2021.5.16；

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

html页面写好后开始写jq部分

定义一个函数用来存放图片的地址，方便后面获取

使用attr设置img标签里面的src值，从集合mma里面获取随机值，

将整个函数包裹起来，每20毫秒调用一次这个函数刷新img标签里面的src值

最后给两个<button>绑定点击事件

当第一个按钮点击的时候去调用autoPlay函数

第二个则将autoPlay函数清除

这样一个简单的抽奖小案例就做好了；

mumudezhi
关注
  • 1
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 4
    评论
简易抽奖系统案例
04-22
抽奖系统简易案例，内含HTML，CSS,JS代码，用到了一些比较简易的js技术
Javascript实现的简单的转盘抽奖小案例+Javascript编程+Javascript小案例+转盘抽奖程序案例
06-05
Javascript实现的简单的转盘抽奖小案例+Javascript编程+Javascript小案例+转盘抽奖程序案例Javascript实现的简单的转盘抽奖小案例+Javascript编程+Javascript小案例+转盘抽奖程序案例Javascript实现的简单的转盘抽奖...
jq小案例：简易的九宫格抽奖
09-09
本案例“简易的九宫格抽奖”是利用jQuery技术实现的一个互动抽奖程序，通常用于吸引用户参与活动，增加互动性和趣味性。下面我们将详细探讨这个案例中的关键知识点。 首先，我们要理解九宫格的布局。九宫格是一种...
python实现抽奖小程序
09-19
Python 实现的抽奖小程序是一个简单的分布式系统，它由客户端（client.py）、服务器端（server.py）以及包含抽奖算法的模块（lottery.py）组成。这个系统设计用于在一个设定的时间范围内公平且随机地分发有限数量的...
抽奖小程序
01-17
在这个特定的案例中，我们有一个名为"抽奖小程序"的项目，它包含两个核心文件：`NameList.txt` 和 `抽奖.html`。下面我们将深入探讨这两个文件及其在抽奖程序中的作用。 首先，`NameList.txt` 文件是参与抽奖人员...
前端HTML总结
m0_54066656的博客
08-05 922
前端笔记，HTML标签详解。
剖析HTML 元素——WEB开发系列02
一条晒干的咸鱼的博客
08-07 678
HTML元素是构成HTML文档结构的基本单位，定义了页面上的不同部分和内容。HTML元素可以包含不同类型的内容，如文本、图片、链接、表格等，每种元素都有其特定的用途和语义。通过组合和嵌套不同的HTML元素，可以创建复杂的网页结构和布局。一、HTML 元素语法HTML 元素以开始标签起始HTML 元素以结束标签终止元素的内容...
前端面试宝典【HTML篇】【6】
BDawn的专栏
08-05 245
canvas标签是 HTML5 中引入的一个新元素，它提供了一个矩形区域，可以在其中绘制图形或图像。canvas 本身并不具备绘图能力，它只是一个容器，所有的绘图工作都需要通过 JavaScript 来完成。 svg标签是用于定义可缩放矢量图形 (Scalable Vector Graphics, SVG) 的容器。SVG 是一种基于 XML 的图形格式，它允许开发者创建高质量的矢量图形，这些图形可以无限放大而不失真。SVG 图形不仅支持静态图像，还支持动画和交互式图形。
Html实现全国省市区三级联动
qq_36973384的博客
08-02 491
关键技术：SpringBoot、Html、Jquery、js、ajax在网上找到的资料都比较乱，对于初学者来说，可能不太友好。以前，我刚开始学习Html的时候，也搞不清楚这个要怎么做，找了好久的资料都没法实现，就算是实现了，也没有完整的教程，现在实现了，整理好了，就想分享一下给每一位热爱编程的小伙伴。
前端（HTML + CSS）小兔鲜儿项目（仿）
最新发布
li3123537691的博客
08-09 194
这是一个简单的商城网站，代码部分为HTML + CSS 和少量JS代码。
创建一个简单的贪吃蛇游戏：HTML、CSS和JavaScript教程
Mr_Zhangyuge的博客
08-08 809
在本教程中，我们将逐步构建一个简单的贪吃蛇游戏。这个项目适合初学者，可以帮助你理解HTML、CSS和JavaScript的基础知识，并掌握如何将它们结合起来创建一个完整的游戏。
HTML - 简易版打字练习
Lushengshi的博客
08-09 576
纯html实现打字软件练习效果
原神4.8版本升级计划数据表
lulei5153的博客
08-09 373
原神4.8版本角色数据升级计划表。
HTML&CSS
ckx0703的博客
08-06 978
html：超文本标记语言——负责网页的结构css：层叠样式表——页面显示的样式、排版js：JavaScript——界面交互（动态交互、逻辑）
fastadmin 实现标签打印
hj1043的博客
08-09 101
项目场景如图，需要打印一批条形码或者二维码，除了市面上成熟的标签机之外，今天挑战一下使用普通的打印机+不干胶贴纸，实现低成本的标签打印；4、后端 model，因为条形码是依赖插件生成，所以这里追加barcode属性。3、后端controller写一个 print 方法。1、项目对应的js添加打印按钮的事件监听。2、打印标签模板的html页面。
“头”和“段”里有什么？ ——WEB开发系列04
一条晒干的咸鱼的博客
08-09 862
作为前端开发人员，理解HTML的基本结构及语义是至关重要的。我们将继续深入探讨HTML中的标题（​​​​到​​​​标签）和段落（​​​​标签）。
HTML 元素提供的附加信息--属性 ——WEB开发系列03
一条晒干的咸鱼的博客
08-08 577
HTML 属性是指用于描述 HTML 元素的额外信息，它们提供了元素的特定配置或行为，属性通常包含在 HTML 元素的开始标签中。
常见面试题（一）HTML的行内元素和块元素以及img作为行内元素可以设置宽高问题
weixin_68441705的博客
08-05 245
替换元素一般有内在尺寸，所以具有 width 和 height，可以设定 不指定 的 width 和 height 时，就按其内在尺寸显示，就是图片被保存的时候的宽度和高度。常见的行内元素有：a，span，img，strong(加粗)，input，label，select，textare，button。如果不是，底层如何实现？常见的块级元素有：div，ul，ol，li，dl，dt，dd，h1，h2，h3，h4，h5，h6，p。行标记的宽高直接设置是无效的，而块标记的宽高是可以直接设置的。
年会抽奖经典案例显示姓名 js
05-05
抽奖经典案例一般是通过随机数来确定获奖者的。以下是一个简单的示例代码，可以用 JavaScript 实现： ```javascript // 定义参加抽奖的人员名单 var names = ["张三", "李四", "王五", "赵六", "钱七", "孙八", "周九", "吴十"]; // 随机生成一个获奖者 var winnerIndex = Math.floor(Math.random() * names.length); var winnerName = names[winnerIndex]; // 输出获奖者姓名 console.log("恭喜 " + winnerName + " 获得了大奖！"); ``` 在上面的代码中，`names` 数组中存储了参加抽奖的所有人员姓名。`Math.random()` 函数返回一个 [0,1) 范围内的随机浮点数，通过乘以 `names.length` 并向下取整，可以得到一个在 [0,names.length-1] 范围内的随机整数，即获奖者在 `names` 数组中的下标。最后，通过 `names[winnerIndex]` 可以获取到获奖者的姓名。
评论 4
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值