Javascript 汽车品牌/车型动态下拉列表

我正在我的网站上建立一个新的表单，我正在使用我在这里找到的一些代码。但是，我在表单中使用这段代码，一旦表单提交，make/model的值不会更改为各自的名称，而是显示它们的表单值。作为一个完整的JS noob，我如何将提交的值从值更改为make/model名称

$document.readyfunction{ var$make=$'make'， $model=$‘model’， $options=$model.find'option'； $make.on'change'，函数{ $model.html$options.filter'[value='+this.value+']； $model.trigger'change'； }.触发“改变”； var$model=$'model'， $year=$‘year’， $yearOptions=$year.find'option'； $model.on'change'，函数{ $year.html$yearOptions.filter'[value='+this.value+']； $year.触发“变化”； }.触发“改变”； 变量$year=$'year'， $identifier=$'identifier'， $identifierOptions=$identifier.find'option'； $year.on'change'，函数{ var filteredifiers=$identifierOptions.filter'[value='+this.value+']； 调试器 如果！$make.val==3&&$model选项：selected.text=='Falcon'{ FiltereDiditifiers=FiltereDiditifiers.FilterFunction I，e{ 返回e.value！==“3” }; } $identifier.htmlfilteredifiers； $identifier.trigger'change'； }.触发“改变”； }; 制作 宝马 大宇 河流浅水处 霍尔顿 本田 现代 五十铃 起亚 雷克萨斯 马自达 三菱 日产 法国标致汽车 斯巴鲁 铃木 丰田 大众 模型 318i 拉诺斯 信使 猎鹰 节日 嘉年华 集中 激光 护林员 领土 阿斯特拉 巴里纳 俘虏 科罗拉多州 准将 克鲁兹 牛仔竞技比赛 万岁 年 1998 1999 2000 2001 2002 2003 2004 2005 1997 1998 1999 2000 2001 2002 2003 1991-1999 1997-2007 1997-2007 2002 2003 2004 2005 1997-2005 1997-2005 1997-2005 1997-2005 1997-2005 1997-2005 1997-2005 1997-2005 类型 E46 不适用 不适用 不适用 文学士 金 AU2 不适用 1997-2005 1997-2005 1997-2005 1997-2005 1997-2005 在每个标记中都有一个名为value的属性。此值属性是在选择该选项时作为下拉列表的值返回的值。似乎在你发现的代码中，它们都被简单地设置为数字。您可以将其设置为您想要的任何内容：

河流浅水处 集中 修复动态选项

我发现修改这些值会直接影响动态选项的显示方式。例如，“汽车模型”下拉列表的“值”属性用于通过仅显示具有相同值的选项来过滤“汽车品牌”下拉列表。我们可以添加一个名为data make的新数据属性，并基于该属性过滤模型下拉列表，而不是使用模型下拉列表的值属性与make进行比较。这允许您自由修改模型中的值属性。下面的示例代码显示了这一点。您需要修改JS，以便模型影响年份，年份以相同的方式影响标识符

$document.readyfunction{ var$make=$'make'， $model=$‘model’， $options=$model.find'option'； $make.on'change'，函数{ //现在，我们使用数据生成属性（而不是值）过滤模型 $model.html$options.filter'[data make='+this.value+']； $model.trigger'change'； }.触发“改变”； $'carForm'。提交函数{ e、 防止违约； 让formData=$this.serializeArray； 让数据={}； 对于let i=0；i您可以像这样获得所选选项文本

$('#form').submit(function(e) {
  e.preventDefault();
  var make = $make.find(':selected').text();
}

---

但最好将期望返回的值设置为选项值，并使用数据属性或类来处理过滤逻辑。

FYI在选项元素中使用值属性是可选的。如果未指定，选项的值将成为option元素的文本。@ScottMarcus是正确的，但是由于原始代码使用value属性进行筛选，因此仍需要修改！谢谢各位！我很感激你的回答，我将实施这一点。另外，我想知道，既然我没有在这里使用年，是否有一个简单的方法来删除它@kht@JoshJacobs如果您没有使用年份或标识符，那么您只需使用上面的代码，只需根据需要在选择下拉列表中添加/删除选项即可