遍历表单选项时,我会根据其值将其选项设置为默认值。
由于我同时具有选择和单选/复选框-有两种设置默认值的方式-已选择/选中。有什么方法可以使用纯JS进行简化-可以同时进行选择和检查吗?
if (param.type.select) {
this.form.querySelector('[value="' + optionKey+'"]').selected = true;
} else {
this.form.querySelector('[value="' + optionKey+'"]').checked = true;
}
您可以将checked
用于所有3种输入类型。观看此演示:
[...document.querySelectorAll("select option")][2].checked = true;
document.querySelector("input[value='cb3']").checked = true;
document.querySelector("input[value='r2']").checked = true;
document.addEventListener("change", showValues);
function showValues() {
console.clear();
console.log(`selected option: ${document.querySelector("select option:checked").value}`);
document.querySelectorAll("input:checked").forEach(v => console.log(`${v.type}: ${v.value}`));
}
<select>
<option>opt 0</option>
<option value="1">opt 1</option>
<option value="2">opt 2</option>
<option value="3" selected>opt 3</option>
<select>
<p>
<input type="checkbox" value="cb1">cb 1
<input type="checkbox" value="cb2">cb 2
<input type="checkbox" value="cb3">cb 3
</p>
<input type="radio" name="x" value="r1"> r1
<input type="radio" name="x" value="r2"> r2
<input type="radio" name="x" value="r3"> r3