用HTML写一个名字抽奖程序
时间: 2023-10-11 21:11:52 浏览: 138
好的,以下是用HTML写的名字抽奖程序:
```
<!DOCTYPE html>
<html>
<head>
<title>名字抽奖程序</title>
<meta charset="UTF-8">
</head>
<body>
<h1>名字抽奖程序</h1>
<p>输入参与抽奖的名字(每个名字一行),点击抽奖按钮进行抽奖。</p>
<textarea id="names" rows="10" cols="50"></textarea><br>
<button onclick="lottery()">抽奖</button><br><br>
<p id="result"></p>
<script type="text/javascript">
function lottery() {
var names = document.getElementById("names").value.split('\n');
var winnerIndex = Math.floor(Math.random() * names.length);
var winner = names[winnerIndex];
document.getElementById("result").innerHTML = "恭喜 " + winner + " 获得大奖!";
}
</script>
</body>
</html>
```
输入参与抽奖的名字,点击抽奖按钮即可进行抽奖,程序会随机选择一个名字作为获奖者。希望能帮到你!
相关问题
用HTML写一个简单的抽奖程序
好的,以下是一个简单的抽奖程序的 HTML 代码:
<html>
<head>
<title>简单抽奖程序</title>
</head>
<body>
<h1>简单抽奖程序</h1>
<p>点击下面的按钮,随机抽取一个幸运者!</p>
<button onclick="randomNumber()">抽奖</button>
<p id="result"></p>
<script>
function randomNumber() {
var num = Math.floor(Math.random() * 10) + 1;
document.getElementById("result").innerHTML = "幸运者是:" + num + "号!";
}
</script>
</body>
</html>
这个程序可以随机抽取 1 到 10 号之间的一个幸运者,并将结果展示在页面上。当然,你可以根据自己的需求来改变选择范围和展示方式。希望这个示例对你有所帮助!
用html和js写一个随机抽奖程序
好的,以下是一个简单的随机抽奖程序的HTML和JS代码:
```html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>随机抽奖程序</title>
</head>
<body>
<h1>随机抽奖程序</h1>
<p>请输入参加抽奖的人员名单,每个名字之间用逗号隔开:</p>
<textarea id="nameList"></textarea><br>
<button onclick="start()">开始抽奖</button><br><br>
<h2 id="result"></h2>
<script>
function start() {
var names = document.getElementById("nameList").value.split(",");
var winner = names[Math.floor(Math.random() * names.length)];
document.getElementById("result").innerHTML = "恭喜 " + winner + " 中奖!";
}
</script>
</body>
</html>
```
首先是一个简单的HTML页面,包含一个输入框用于输入参加抽奖的人员名单,一个按钮用于开始抽奖,以及一个用于显示中奖结果的标题。
在JS代码中,当用户点击“开始抽奖”按钮时,我们首先获取输入框中的名单,使用`split()`方法将其转换为一个数组。然后,我们使用`Math.random()`方法生成一个0到1之间的随机数,乘以名单长度后向下取整,得到一个随机的数组下标,即为中奖者的位置。最后,我们将中奖者的名字显示在页面上。