JavaScript获取表单下拉列表选中值的正确方法咨询

你之前的代码没生效，核心问题是搞混了selectedIndex的返回值——它是数字类型的选项索引（比如第一个选项对应0，第二个对应1），根本不是选项的文本或value值，所以拿它和"Sétif"字符串比较肯定不会匹配上啦😉

下面给你几种靠谱的获取下拉选中值的方法，按需选用：

方法一：直接通过表单元素的value属性获取（最简便） #

下拉列表的value会自动同步选中选项的value属性，所以直接取就行：

// 获取wilaya下拉的选中value
const selectedWilaya = document.forms.ins.wilaya.value;
if (selectedWilaya === "Setif") {
  alert("vous avez choisi Sétif");
}

方法二：获取选中选项的文本或value（适合需要操作选项细节的场景） #

如果需要拿到选项的显示文本（比如你例子里的"Sétif"，而不是value的"Setif"），可以先获取选中的选项对象：

const wilayaSelect = document.forms.ins.wilaya;
// 拿到选中的选项元素
const selectedOption = wilayaSelect.options[wilayaSelect.selectedIndex];

// 获取选项的value值
const selectedValue = selectedOption.value;
// 获取选项的显示文本
const selectedText = selectedOption.text;

// 比如按文本判断
if (selectedText === "Sétif") {
  alert("vous avez choisi Sétif");
}

方法三：通过ID获取下拉元素（不依赖表单名称，更灵活） #

你的wilaya下拉有id="wilaya_list"，直接用ID定位更直观：

const wilayaSelect = document.getElementById("wilaya_list");
const selectedValue = wilayaSelect.value;
if (selectedValue === "Setif") {
  alert("vous avez choisi Sétif");
}

针对「activité sportives」下拉的示例 #

如果这个下拉的name是带空格的，要注意用方括号语法访问：

const sportSelect = document.forms.ins["activité sportives"];
const selectedSport = sportSelect.value;
if (selectedSport === "football") {
  alert("Vous avez choisi le football !");
}

小提醒 #

• 注意区分选项的value属性和显示文本：你的例子里value是"Setif"，文本是"Sétif"，判断时要选对目标值
• 如果下拉name包含空格、特殊字符，必须用form["元素名称"]的方式访问，不能用点语法（比如form.activité sportives会报错）

内容的提问来源于stack exchange，提问作者Mafaza