从查询字符串中更改选定的 div

Question

我有以下基于 bootstrap 的下拉列表。

<div class="form-group">
  <label for="form_name">Title</label>
  <select id="hpsel" class="c-form-profession form-control">
    <option value="con01">Option 1</option>
    <option value="con02">Option 2</option>
    <option value="con03">Option 3</option>
    <option value="con04">Option 4</option>
  </select>
</div>

我想更改查询字符串中的选定值，因此 ?something=con02 打开预选了 con02 的页面。

我从其他答案中尝试了一些方法，但它们似乎对我的 bootstrap 下拉菜单不起作用。

Answer 1

你或许可以这样做：

const urlParams = new URLSearchParams(window.location.search);
const myParam = urlParams.get('something');

document.querySelector('option[value=' + myParam + ']').setAttribute('selected', "")

Answer 2

你可以试试这个：

const urlParams = new URLSearchParams(window.location.search);
const something = urlParams.get('something');

document.getElementById('hpsel').value = something;

从查询字符串中更改选定的 div

Change selected div from query string

html

javascript

css

jquery

query-string