javascript - 如何将两个选择框中的两个值添加到一个 URL 路径

Question

这里是两个选择框，我需要的是如果从两个框中都选择了值，则两者都应该显示在 URL 中，例如 www.example.com#135+#140

 <select name="search_region" id="search_region" class="search_region">
        <option value="0">All Regions</option>
        <option class="level-0" value="135">HTML</option>
        <option class="level-0" value="136">PHP</option>
        <option class="level-0" value="137">CSS</option>
    </select>

    <select name="search_categories" id="search_categories" class="search_categories">
        <option value="">Select Category</option>   
        <option class="level-0" value="140">Java</option>
        <option class="level-0" value="141">Script</option>
    </select>

下面是我运行的脚本，用于显示 URL 中的 #search_regions 值，到目前为止，它运行良好。现在能够将 #search_categories 值添加到其中。

<script type="text/javascript">
$(function(){
    $('#search_region').change(function () {
        var url = $(this).val();
        window.location.hash = url;
        console.log('select Changed');
    });
});
window.addEventListener('hashchange', fn, false);

window.onload = fn; // fire on pageload

function fn() {
    $('#search_region').val(window.location.hash.replace('#', ''));
    console.log("hash = " + window.location.hash);
}
 </script>

关于如何做到这一点有什么想法吗？

这是我之前提出的问题的补充

Getting the select value to display in a new browser

Answer 1

一步构建网址参数，然后在另一步骤更新窗口位置。

也就是说，location.hash 是任何以哈希开头的参数，我不知道它将如何处理多个带有哈希的参数。