我必须在 Js + 中将按钮的值设置为文本框,使随机发生器不一样



代码工作

数字是随机的,这很好。我需要更改它,就像 0-9 数字不应该重复一样,当我单击"数字"类下的按钮时,ID 是"s1,s2,s3,s4..."。

当我点击它时,就像

1 2 3               3   5   7                        3 5 2
4 5 6   not like   !4  !4   2 It must be like this   1 4 7
7 8 9     ---->     8  !0   9      ----->            8 0 9
0                  !0                                6

++++

按钮的当前值必须在文本框中设置,当我单击它时,该 id 为"getir"。

这必须完成,我无法使其成为Javascript

function Random() {
return (Math.floor(Math.random() * 10));
}
function randomValue() {
var x = document.getElementsByClassName("numbers")
var i;
for (i = 0; i < x.length; i++) {
x[i].value = Random()
}
}
function silYazi() {
document.getElementById("getir").value = "";
}
<table>
<tr>
<input type="text" id="getir" value="" name="getir">
</tr>
<br>
<tr>
<input id="s1" type="button" class="numbers btn btn-outline-success mt-3" onclick="randomValue()"
value="1">
<input id="s2" type="button" class="numbers btn btn-outline-success mt-3 ml-4" onclick="randomValue();"
value="2">
<input id="s3" type="button" class="numbers btn btn-outline-success mt-3 ml-4" onclick="randomValue();"
value="3">
</tr>
<br>
<tr>
<input id="s4" type="button" class="numbers btn btn-outline-success mt-3" onclick="randomValue();"
value="4">
<input id="s5" type="button" class="numbers btn btn-outline-success mt-3 ml-4" onclick="randomValue();"
value="5">
<input id="s6" type="button" class="numbers btn btn-outline-success mt-3 ml-4" onclick="randomValue();"
value="6">
</tr>
<br>
<tr>
<input id="s7" type="button" class="numbers btn btn-outline-success mt-3" onclick="randomValue();"
value="7">
<input id="s9" type="button" class="numbers btn btn-outline-success mt-3 ml-4" onclick="randomValue();"
value="8">
<input id="s8" type="button" class="numbers btn btn-outline-success mt-3 ml-4" onclick="randomValue();"
value="9">
</tr>
<br>
<tr>
<input id="s0" type="button" class="numbers btn btn-outline-success mt-3" onclick="randomValue();"
value="0">
<input id="btnSil" type="button" class="btn btn-outline-danger mt-3 ml-5" onclick="silYazi();"
value="Sil">
</tr>
</table>

数字是随机的,这很好。我需要更改它,就像单击按钮时 0-9 个数字不应该重复一样

从随机分布中挑选数字是行不通的,因为每次抽奖都是独立的,而且你的人口非常少,因此你会得到重复。

与其选择随机数,不如洗牌一个固定的数字列表(这里从0到9(。以下是应用于键盘的快速概念证明(使用此 Fisher-Yates 实现(:

const buttons = document.querySelectorAll("input");
const numbers = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9];
for (let i = 0, len = buttons.length; i < len; i++) {
buttons[i].value = numbers[i];
buttons[i].addEventListener("click", shuffleKeypad);
}
function shuffleKeypad() {
shuffle(numbers);
for (let i = 0, len = buttons.length; i < len; i++) {
buttons[i].value = numbers[i];
}
}
/**
* Shuffles array in place.
* @param {Array} a items An array containing the items.
*/
function shuffle(a) {
var j, x, i;
for (i = a.length - 1; i > 0; i--) {
j = Math.floor(Math.random() * (i + 1));
x = a[i];
a[i] = a[j];
a[j] = x;
}
return a;
}
<table>
<tbody>
<tr>
<td><input type="button"></td>
<td><input type="button"></td>
<td><input type="button"></td>
</tr>
<tr>
<td><input type="button"></td>
<td><input type="button"></td>
<td><input type="button"></td>
</tr>
<tr>
<td><input type="button"></td>
<td><input type="button"></td>
<td><input type="button"></td>
</tr>
<tr>
<td><input type="button"></td>
</tr>
</tbody>
</table>

如果有人需要,我自己解决...

////////////////////////////////////////////////////////
function yazdir(yazi) {
document.getElementById("getir").value += yazi;
function Random() {
return (Math.floor(Math.random() * 10));
}
var i;
for (i = 0; i < 10; i++) {
a = Random(); //a = 5
var x = document.getElementById("s" + i); // 1 değeri için  x=1
var y = document.getElementById("s" + a);
var temp;
temp = x.value; // x : 0
x.value = y.value; // y :5
y.value = temp; //temp :0
}
}
function silYazi() {
document.getElementById("getir").value = "";
}
<table>
<tr>
<input type="text" id="getir" value="" name="getir" disabled>
</tr>
<br>
<tr>
<input id="s1" type="button" class="numbers btn btn-outline-success mt-3" onclick="yazdir(value)" value="1">
<input id="s2" type="button" class="numbers btn btn-outline-success mt-3 ml-4" onclick="yazdir(value)" value="2">
<input id="s3" type="button" class="numbers btn btn-outline-success mt-3 ml-4" onclick="yazdir(value)" value="3">
</tr>
<br>
<tr>
<input id="s4" type="button" class="numbers btn btn-outline-success mt-3" onclick="yazdir(value)" value="4">
<input id="s5" type="button" class="numbers btn btn-outline-success mt-3 ml-4" onclick="yazdir(value)" value="5">
<input id="s6" type="button" class="numbers btn btn-outline-success mt-3 ml-4" onclick="yazdir(value)" value="6">
</tr>
<br>
<tr>
<input id="s7" type="button" class="numbers btn btn-outline-success mt-3" onclick="yazdir(value)" value="7">
<input id="s8" type="button" class="numbers btn btn-outline-success mt-3 ml-4" onclick="yazdir(value)" value="8">
<input id="s9" type="button" class="numbers btn btn-outline-success mt-3 ml-4" onclick="yazdir(value)" value="9">
</tr>
<br>
<tr>
<input id="s0" type="button" class="numbers btn btn-outline-success mt-3" onclick="yazdir(value)" value="0">
<input id="btnSil" type="button" class="btn btn-outline-danger mt-3" onclick="silYazi();" value="Sil">
</tr>
</table>

最新更新