以下是一个示例代码,演示了如何根据下拉菜单的选择自动填充表格信息:
HTML部分:
姓名
年龄
性别
JavaScript部分:
document.getElementById("dropdown").addEventListener("change", function() {
var selectedOption = this.value;
var name, age, gender;
// 根据选择的选项设置相应的信息
switch(selectedOption) {
case "option1":
name = "张三";
age = 20;
gender = "男";
break;
case "option2":
name = "李四";
age = 25;
gender = "女";
break;
case "option3":
name = "王五";
age = 30;
gender = "男";
break;
default:
name = "";
age = "";
gender = "";
}
// 将信息填充到表格中的对应单元格
document.getElementById("name").innerHTML = name;
document.getElementById("age").innerHTML = age;
document.getElementById("gender").innerHTML = gender;
});
以上代码中,我们首先为下拉菜单添加了一个change事件监听器。当下拉菜单的选项发生变化时,触发该事件。然后,我们根据选中的选项设置相应的信息。最后,我们将信息填充到表格中的对应单元格中。
注意:以上代码仅为示例,实际应用中可能需要根据具体需求进行相应的修改和优化。
下一篇:表格格式不符合预期