Input 根据下拉值更改链接href

我有一个带有a href链接的按钮：

<a href="mysite.com/filter">My button</a>

然后我有3个下拉（选择）输入，让我们称它们为A、B和C

根据用户的选择，我希望将链接更改为

<a href="mysite.com/filter-A-B-C">My button</a>

---

这三个下拉列表都是必需的

请找到以下有用的代码片段。处理查询参数的默认值

<select id="a" onchange="changeUrl()">
  <option value="a1">a1</option>
   <option value="a2">a2</option>
</select>

<select id="b" onchange="changeUrl()">
  <option value="b1">b1</option>
   <option value="b2">b2</option>
</select>

<select id="c" onchange="changeUrl()">
  <option value="c1">c1</option>
   <option value="c2">c2</option>
</select>

 <a id="test" href="mysite.com">My button</a>
  <script>
  function changeUrl(){
  let url="mysite.com?a=";
  let a= document.getElementById('a').value;
  url+=a+"&b=";
  let b=document.getElementById('b').value;
  url+=b+"&c=";
  let c=document.getElementById('c').value;
  url+=c;
  document.getElementById('test').href=url;
  }
  </script>
</body>

a1
a2
b1
b2
c1
c2
函数changeUrl（）{
让url=“mysite.com？a=”；
设a=document.getElementById（'a'）.value；
url+=a+“&b=”；
设b=document.getElementById（'b'）.value；
url+=b+“&c=”；
设c=document.getElementById（'c'）.value；
url+=c；
document.getElementById（'test'）。href=url；
}

谢谢您的回答！它几乎成功了。问题是这段代码生成了一个href，其中包含=和？和&符号-“a=a1&b=b2&c=c1”，我不需要。我需要的href只是“…a-b-c”在“url+=a+”之后对文本做了一点修改，效果非常好！非常感谢苏达卡！健康