Javascript 键入时根据输入字段动态更改选择选项

我的项目中有一个输入字段和一个选择字段。我想根据用户输入的内容（字母和数字的组合）动态更改选择选项。用户也可以自己选择它，动态变化是一种帮助

<input id="userInput" type="text" class="form-control" placeholder="Type here">

<select id="sel" class="form-control form-control-xl">
  <option selected>Choose one</option>
  <option value="1">Dog</option>
  <option value="2">Cat</option>
  <option value="3">Lizard</option>
  <option value="4">Fish</option>
</select>

---

与使用autosuggest的搜索字段类似，更改选项的正确方法是什么？

您可以为每个模式创建一个

regex

，作为

字典。然后，当文本框值更改时，可以循环并匹配它


var dict=[]；//创建一个空数组
window.onload=函数（）{
dict.push（{key:“1”，value:“^z+[0-9]*$”}）；//第一个字母是z，后面是数字
dict.push（{key:“2”，value:“^AB[0-9]*YZ$”}）；//beginsWith==AB和endsWith==YZ，数字介于
dict.push（{键：“3”，值：“^Cat$”}）；
dict.push（{键：“4”，值：“^Lizard$”}）；
dict.push（{键：“5”，值：“^Fish$”}）；
}
功能测试（）
{
var userInput=document.getElementById（'userInput'）.value；
var sel=document.getElementById（'sel'）；
sel.value=“”；
var isMatched=假；
对于（变量i=0；i


选一个
先是字母Z，然后是数字
以AB开头，数字介于adn和YZ之间
猫
蜥蜴
鱼
使用regex…….输入的字母数字字符串与
中的选项有什么关系？字母数字字符串的类型通过顺序字符串确定选项，例如
Z12345
id表示狗，
AB12345YZ
表示猫。或者会为你做这太好了！一个问题-有时我必须执行一个操作来更改值，例如，在输入字段外单击。有没有办法解决这个问题？请尝试其他事件
onKeyUp
或
orKeyDown
var userInput = document.getElementById('userInput').value;
var sel = document.getElementById('sel');

if (userInput firstletter is Z and followed by numbers) {
    $('#sel').val('1').change(); // Dog
} else if (userInput beginsWith === AB and endsWith === YZ with numbers between) {
    $('#sel').val('2').change(); // Cat
} else if (userInput endsWith === XX) {
    $('#sel').val('3').change(); // Lizard
} else if (userInput beginsWith === 222) {
    $('#sel').val('4').change(); // Fish
}