第一个input中value是123点击按钮使第一个input中value随机变换到其他三个input中
时间: 2023-05-29 19:04:11 浏览: 145
在第一个input框内输入内容.textarea自动得到第一个文件框的值的javascript代码
的value值,同时保证每个input中的value值都不重复。
以下是一种可能的实现方式:
HTML代码:
```
<input id="input1" type="text" value="123">
<input id="input2" type="text" value="456">
<input id="input3" type="text" value="789">
<input id="input4" type="text" value="012">
<button onclick="shuffleValues()">随机变换</button>
```
JavaScript代码:
```
function shuffleValues() {
// 获取四个输入框元素
const input1 = document.getElementById("input1");
const input2 = document.getElementById("input2");
const input3 = document.getElementById("input3");
const input4 = document.getElementById("input4");
// 定义一个数组,存储所有可能的value值
const values = ["123", "456", "789", "012"];
// 从数组中随机选择一个值,作为第一个输入框的新value
const newValue1 = values[Math.floor(Math.random() * values.length)];
// 从数组中剩余的值中再随机选择三个值,作为其他三个输入框的新value
const remainingValues = values.filter(value => value !== newValue1);
const newValue2 = remainingValues.splice(Math.floor(Math.random() * remainingValues.length), 1)[0];
const newValue3 = remainingValues.splice(Math.floor(Math.random() * remainingValues.length), 1)[0];
const newValue4 = remainingValues[0];
// 将新value赋值给对应的输入框
input1.value = newValue1;
input2.value = newValue2;
input3.value = newValue3;
input4.value = newValue4;
}
```
解释:该函数首先获取四个输入框的元素,然后定义一个包含所有可能的value值的数组。随机选择一个值作为第一个输入框的新value,然后从数组中剩余的值中再随机选择三个值,分别作为其他三个输入框的新value。最后将新value赋值给对应的输入框。注意,这里使用了数组的filter和splice方法来避免重复选择相同的value值。
阅读全文