JQuery根据下拉菜单中的选择更改值

使用JQuery我正在尝试创建一个下拉菜单，然后根据人们在菜单中选择的内容更改搜索输入元素上的某个值。

到目前为止，我已经找到了如何定位我需要改变的价值。 我已经得到了它，所以如果有人从菜单中做出任何选择，它会将搜索输入值更改为一个特定值：

 
 
 Select A Color  Blue Red Yellow  
 
 
  $(function() { $('select[name="color"]').change(function() { $('input[name="ancestorId"]').val("9999"); }); });  

我现在需要的是根据菜单选择设置值的东西，匹配如下：

 Blue = 9999 Red = 8888 Yellow = 7777 

我仍然在看例子，并会继续尝试，但有点卡住。 任何建议表示赞赏

Answer 1

您应该将值赋值放在选项元素中，因为它们是为此而设计的：

  Blue Red Yellow  

并且脚本几乎保持不变，除了我在选择器中使用了元素ID而不是它们的名称（假设这里你的祖先元素有这样的ID）：

 $(function() { $('#color').change(function() { $('#ancestor').val($(this).val()); }).change(); // Trigger the event }); 

请注意，链接的.change()调用将触发刚刚分配的更改事件，以便在页面加载时将预先选择的项的值填充到文本字段中。

看到它在行动：

 $(function() { $('#color').change(function() { $('#ancestor').val($(this).val()); }).change(); // Trigger the event }); 

   Blue Red Yellow