前端实现一个抽奖程序,5位参与者的姓名保存到数组中以弹窗的形式随机抽取一位显示输出,一直到所有的参与者抽到为止
时间: 2024-02-18 12:02:51 浏览: 118
抽奖小程序源码,多方式实现展示抽奖功能【后台源码+前端】
3星 · 编辑精心推荐
好的,这是一个简单的前端抽奖程序的实现方法:
HTML部分:
```html
<button onclick="startLottery()">开始抽奖</button>
```
JavaScript部分:
```javascript
// 参与者姓名数组
var participants = ["张三", "李四", "王五", "赵六", "钱七"];
// 开始抽奖函数
function startLottery() {
// 如果所有参与者都已经抽到,则提示抽奖已结束
if (participants.length === 0) {
alert("抽奖已结束!");
return;
}
// 随机抽取一个参与者
var index = Math.floor(Math.random() * participants.length);
var winner = participants[index];
// 在弹窗中显示获奖者姓名
alert("恭喜 " + winner + " 获得奖品!");
// 从参与者数组中移除已经抽中的参与者
participants.splice(index, 1);
}
```
以上代码会在点击“开始抽奖”按钮时触发 `startLottery()` 函数。该函数会随机抽取一个参与者并在弹窗中显示获奖者姓名。每抽取一个参与者,程序会将其从参与者数组中移除,直到所有参与者都已经抽到为止。
阅读全文