写一个随机数字HTML代码要求:生成个数、随机数范围可随意符号、是否重复
时间: 2023-08-12 13:05:07 浏览: 133
下面是一个示例的随机数字HTML代码,可以根据您的具体要求进行调整:
```html
<!DOCTYPE html>
<html>
<head>
<title>随机数字生成器</title>
</head>
<body>
<h1>随机数字生成器</h1>
<form>
<label for="num">生成个数:</label>
<input type="number" id="num" name="num" value="10"><br><br>
<label for="range">随机数范围:</label>
<input type="text" id="range" name="range" placeholder="例如:1-100"><br><br>
<label for="unique">是否允许重复:</label>
<input type="checkbox" id="unique" name="unique"><br><br>
<input type="button" value="生成随机数字" onclick="generateRandomNumbers()">
</form>
<h2>随机数字列表:</h2>
<ul id="random-numbers"></ul>
<script>
function generateRandomNumbers() {
// 获取表单中的参数
var num = parseInt(document.getElementById("num").value);
var range = document.getElementById("range").value.trim();
var unique = document.getElementById("unique").checked;
// 解析随机数范围
var min, max;
if (range) {
var parts = range.split(/[^\d\-]/);
min = parseInt(parts[0]);
max = parseInt(parts[1]);
} else {
min = 0;
max = 100;
}
// 生成随机数字数组
var numbers = [];
while (numbers.length < num) {
var number = Math.floor(Math.random() * (max - min + 1)) + min;
if (!unique || numbers.indexOf(number) === -1) {
numbers.push(number);
}
}
// 清空列表并添加新的随机数字
var list = document.getElementById("random-numbers");
list.innerHTML = "";
for (var i = 0; i < numbers.length; i++) {
var li = document.createElement("li");
li.textContent = numbers[i];
list.appendChild(li);
}
}
</script>
</body>
</html>
```
该代码包含以下功能:
- 生成个数:通过输入框输入需要生成的随机数字个数。
- 随机数范围:通过输入框来输入随机数字的范围,可以包含任意符号,例如:1-100、0~100、-100到100等等。
- 是否允许重复:通过复选框来控制是否允许生成重复的随机数字。
- 生成随机数字:通过点击按钮来生成随机数字。
- 随机数字列表:通过无序列表来展示生成的随机数字。
阅读全文