<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<div>
<span>Min: </span>
<input style="width:50px" type="text" id="min" />
<br />
<span>Max:</span>
<input style="width:50px" type="text" id="max" />
<br />
<span>Tuş:</span>
<input style="width:50px" id="key" />
<br />
<input type="text" style="width:50px" disabled id="value" />
</div>
</body>
<script>
const inputKey = document.getElementById("key");
const inputVal = document.getElementById("value");
const inputMin = document.getElementById("min");
const inputMax = document.getElementById("max");
const numRegEx = /^\d*$/;
let key;
inputKey.addEventListener("input", (inp) => {
if (inp.target.value.length > 1) {
inp.target.value = inp.target.value.slice(0, -1);
}
inp.target.value = inp.target.value.toLowerCase();
})
inputMin.addEventListener("input", (inp) => {
if (!numRegEx.test(inp.target.value)) {
inp.target.value = inp.target.value.slice(0, -1);
}
})
inputMax.addEventListener("input", (inp) => {
if (!numRegEx.test(inp.target.value)) {
inp.target.value = inp.target.value.slice(0, -1);
}
})
document.addEventListener("keypress", (e) => {
if (!inputMin.value || !inputMax.value) return;
min = Number(inputMin.value);
max = Number(inputMax.value);
if (e.key === inputKey.value) {
inputVal.value = Math.floor(Math.random() * (max - min + 1)) + min;
}
})
</script>
</html>