html - 从下拉菜单将多个参数传递给 url

Question

这可能是一个基本问题，但我找不到解决方案。 我有两个下降。我想将 url 参数从第二个下拉附加到第一个，但我做不到。这是一个例子。

当我从 dropdown1 中选择 SUB11 时，参数会像这样附加到 URL 中

http://localhost:8080/test/testing.html?par1=sub11

现在，当我从下拉列表 2 中选择 SUB21 时，这就是我得到的(不是我想要的)

http://localhost:8080/test/testing.html&par2=sub21

但我希望它是这样的，附加到已经存在的 url 参数。

http://localhost:8080/test/testing.html?par1=sub11&par2=sub21

我认为这与 dropdown2 中的 href 有关，我不知道将其设置为什么。请帮忙。

 <ul>
        <li>
            <a href="#">Menu 1</a>
            <ul class="dropdown">
                <li><a href="?par1=sub11">SUB11</a></li>
                <li><a href="?par1=sub12">SUB12</a></li>
                <li><a href="?par1=sub13">SUB13</a></li>
            </ul>

        </li>
         <li>
            <a href="#">Menu 2</a>
            <ul class="dropdown">
                <li><a href="&amp;par2=sub21">SUB21</a></li>
                <li><a href="&amp;par2=sub22">SUB22</a></li>
                <li><a href="&amp;par2=sub23">SUB23</a></li>
            </ul>

        </li>
    </ul>  

Answer 1

理想情况下，您可以创建一个 HTML 表单并使用 <select>元素。

<form method="get">
<select name="menu-1">
    <option value="SUB11">SUB11</option>
    <option value="SUB12">SUB12</option>
    <option value="SUB13">SUB13</option>
</select>
<select name="menu-2">
    <option value="SUB21">SUB21</option>
    <option value="SUB22">SUB22</option>
    <option value="SUB23">SUB23</option>
</select> 
<input type="submit" value="Submit" />

点击提交，您将看到它们在 URL 中: http://localhost:8080/test/testing.html?menu-1=SUB11&menu-2=SUB21

检查一下 https://developer.mozilla.org/en-US/docs/Web/HTML/Element/select