我想有一个依赖的数字输入。
此数字输入依赖于一个选择框，该选择框通过选择每个选项为输入创建一个特定的数字范围。
例如：
如果我们选择option2，数字输入将是min=20和max=50！如果我们选择option3，数字输入将是min=10和max=30！怎样才能创造出这样一个特征呢？
以下是我尝试过的：
<form>
<select id="selbox">
<option value="option1">option1</option>
<option value="option2">option2</option>
<option value="option3">option3</option>
</select>
<input type="number" id="num">
<button>click</button>
</form>
您可以在JavaScript中通过向select标记添加一个change EventListener来实现这一点，它将帮助您提取选定的范围值。然后将这些属性设置为输入的min和max属性。
null
const select = document.querySelector("#selbox");
const textBox = document.querySelector("#num");
select.addEventListener("change", setRangeForInput);
function setRangeForInput() {
const [rangeMin, rangeMax] = select.value.split('-'); //this is ES6 destructuring syntax
textBox.setAttribute("min", rangeMin);
textBox.setAttribute("max", rangeMax);
}<form>
<select id="selbox">
<option value="20-40">option1</option>
<option value="30-50">option2</option>
<option value="3-7">option3</option>
</select>
<input type="number" id="num">
<button>click</button>
</form>