Javascript 根据下拉选项值更改表单选择名称

Javascript 根据下拉选项值更改表单选择名称,javascript,jquery,html,Javascript,Jquery,Html,我有一个如下所示的搜索表单: <form action="https://someform.foo" target="_blank"> <div class="searchTerm"> <input placeholder="Search here" autofocus="autofocus" id="query" class="searchbox" name="queryString"> <input type="hidden" name="forma

我有一个如下所示的搜索表单:

<form action="https://someform.foo" target="_blank">
<div class="searchTerm">
<input placeholder="Search here" autofocus="autofocus" id="query" class="searchbox" name="queryString">
<input type="hidden" name="format" value="all">
</div>
    <div class="dropdown">
      <select name="scope" id="searchLibrary" class="custom-dropdown-menu">
        <option name="scope" value="aa:aaaa" selected>Search A</option>
        <option name="subscope" value="bb:bbbb::bb:bbbb">Search B</option>
        <option name="scope" value="cc:cccc">Search C</option>
        <option name="scope" value="dd:dddd">Search D</option>
        <option name="scope" value="">Search E</option>                 
      </select>
    </div>
<input type="submit" class="headersubmit" value="&#xf002;" title="Search">

</form>
提交表单时,用户将被定向到搜索结果页面,URL根据所选选项形成。下拉选项名称正在URL范围中设置参数名称

例如,如果用户从选项中选择搜索A,则URL如下所示:

<form action="https://someform.foo" target="_blank">
<div class="searchTerm">
<input placeholder="Search here" autofocus="autofocus" id="query" class="searchbox" name="queryString">
<input type="hidden" name="format" value="all">
</div>
    <div class="dropdown">
      <select name="scope" id="searchLibrary" class="custom-dropdown-menu">
        <option name="scope" value="aa:aaaa" selected>Search A</option>
        <option name="subscope" value="bb:bbbb::bb:bbbb">Search B</option>
        <option name="scope" value="cc:cccc">Search C</option>
        <option name="scope" value="dd:dddd">Search D</option>
        <option name="scope" value="">Search E</option>                 
      </select>
    </div>
<input type="submit" class="headersubmit" value="&#xf002;" title="Search">

</form>
scope/subscope参数是由selectname值设置的,但是如果用户确实从搜索框中选择了Search B,那么我需要在结果URL中将“scope”变成“subscope”

但选择搜索B需要生成以下URL:

我无法将参数元素称为subscope,它始终称为scope

我一直在尝试一些jQuery,并用它进行了测试。我可以让警报出现,告诉我选择名称已更改,但它实际上没有更改URL参数


感谢所有建议/文件/建议

提交时,您可以识别所选选项的名称和值,您可以使用该名称和值生成URL:

const searchLibrary=document.querySelector'searchLibrary'; document.querySelector'form'。addEventListener'submit',e=>{ e、 防止违约; const option=searchLibrary.options[searchLibrary.selectedIndex]; const name=option.getAttribute'name'; 常量{value}=option; const queryString=document.querySelector'query'。值; 常量url=`https://someform.foo/?queryString=${queryString}&format=all&${name}=${value}`; 日志“重定向到”+url; //window.openurl; }; 搜索 搜索B 搜索C 搜索D 搜索引擎
太棒了-这正是我想要的,非常感谢!