基于 URL 参数，使用 jQuery 设置下拉选项

Question

我发现了很多关于这个主题的类似问题，但没有一个能真正回答我的情况，所以我决定发布一个新问题：

我有一页有几个隐藏部分（不同语言的相同内容）。隐藏部分基于语言的下拉菜单显示（我为此使用 jQuery，它只隐藏/显示同一页面上的部分 - 页面 URL 保持不变）这一切正常。但是，我需要找到一种方法让人们选择他们的语言而不是默认语言（英语）到达页面。

我会使用以下其中之一：(example.com/page/#german) 或 (example.com/page/?german)，但它需要连接到现有的 jQuery 和 HTML，以便选择 URL 信息正确的语言。我该怎么做？

这是语言选择器的 HTML：

<select id="language_selector">
    <option value="german">Deutsch</option>
    <option value="english" selected >English</option>
    <option value="spanish">Español</option>
    <option value="french">Français</option>
 </select>

这是我用来仅显示所选语言 HTML 内容的 jQuery 代码（基于 ID）：

hideAllDivs = function () {
    $("#English").hide();
    $("#French").hide();
    $("#German").hide();
    $("#Spanish").hide();
};

handleNewSelection = function () {
    hideAllDivs();
    
    switch ($(this).val()) {
        case 'english':
            $("#English").show();
        break;
        case 'french':
            $("#French").show();
        break;
        case 'german':
            $("#German").show();
        break;
        case 'spanish':
            $("#Spanish").show();
    }
};

我在想解决方法是获取 URL 值，仅选择参数，然后将其传递给 jQuery 以选择正确的选项，但我不知道该怎么做，也没有破坏我现有的语言选择器（我仍然希望人们能够手动更改他们的语言）

Answer 1

    // url : 'example.com/page?language=german';
    let language = (new URLSearchParams(window.location.search)).get('language') ?? 'english';
    $('#language_selector').val(language);
    handleNewSelection();