Javascript设置输入字段值

在网页开发中，常常需要通过Javascript动态地修改输入字段（Input）的值。例如，在表单提交前需要根据用户的选择自动填充一些字段。

基本用法

要设置一个输入字段的值，可以使用value属性。例如：

document.getElementById("myInput").value = "hello world";

这行代码会将ID为myInput的输入字段的值设置为hello world。

获取用户输入

在设置输入字段值之前，通常需要先获取用户的输入。可以使用value属性来获取输入字段的值。例如：

var userInput = document.getElementById("userInput").value;

这行代码会将ID为userInput的输入字段的值赋值给变量userInput。

动态修改输入字段值

除了在代码中设置输入字段的值外，还可以响应用户的动作，根据用户的选择动态修改输入字段的值。例如：

<form>
  <input type="radio" name="gender" value="male" onchange="updateName()"> Male<br>
  <input type="radio" name="gender" value="female" onchange="updateName()"> Female<br>
  <input type="text" id="username">
</form>

<script>
function updateName() {
  var gender = document.querySelector('input[name="gender"]:checked').value;
  var prefix = (gender == "male") ? "Mr." : "Ms.";
  var username = document.getElementById("username");
  username.value = prefix + " ";
}
</script>

这段代码会创建一个表单，其中包含两个单选框和一个输入字段。当用户选择单选框时，页面会调用updateName()函数来动态地修改输入字段的值。

注意事项

• 修改输入字段的值可能会影响提交的数据，因此要谨慎使用。
• 如果需要在多个输入字段之间切换，建议使用select元素。
• 修改输入字段的值后，可能需要手动触发表单的change事件。