固定结果的抽签html
时间: 2024-10-09 22:10:49 浏览: 71
简易抽签网页程序,HTML5编写
固定结果的抽奖活动通常会在HTML中结合JavaScript来实现。以下是一个简单的示例,展示如何创建一个HTML页面来进行抽签活动,并显示预设的结果:
```html
<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<title>固定结果抽奖</title>
<style>
#result {
margin-top: 20px;
font-weight: bold;
}
</style>
</head>
<body>
<h1>固定结果抽奖</h1>
<button onclick="drawPrize()">开始抽奖</button>
<div id="result" class="hidden"></div>
<script>
// 预设的奖品列表(这里每个元素代表一个奖品)
const prizes = ["一等奖", "二等奖", "三等奖", "谢谢参与"];
function drawPrize() {
// 获取奖品容器并清空内容
var resultDiv = document.getElementById("result");
resultDiv.innerHTML = ""; // 清除之前的显示
// 隐藏默认样式
resultDiv.classList.remove("hidden");
// 显示预设的奖品
resultDiv.textContent = prizes[Math.floor(Math.random() * prizes.length)];
}
</script>
</body>
</html>
```
在这个例子中,当你点击“开始抽奖”按钮时,`drawPrize`函数会被触发。它从预设的奖品数组中随机选择一个奖品,然后在页面上显示出来。由于奖品列表是固定的,所以每次抽奖都会得到同样的结果。
阅读全文