javascript - 更改下拉列表时替换URL查询字符串值

我有一个下拉菜单，它具有双重作用。用户可以直接进入页面(http://mysite/events/Pages/default.aspx)并使用下拉菜单，也可以先进行搜索，然后通过选择下拉菜单进一步过滤搜索结果。
首例网址将类似于
http://mysite/events/Pages/default.aspx?hos=Carmel和
第二种情况网址
http://mysite/events/Pages/default.aspx?kwd=health&type=Events&hos=Carmel
这就是我现在正在做的事情，但是它的行为很奇怪，并且确实可以向http://mysite.events/Pages/default.aspx?hos=Crown&hos=Carmel添加网址

因此，如果用户第一次从下拉列表中选择了carmel并决定要查找印第安纳波利斯，则应该将“Carmel”替换为印第安纳波利斯，或者将整个字符串“＆hos = Carmel”替换为“＆hos = Indianapolis”。第二种情况，第一种情况是“？hos = Carmel”和“？hos = Indianapolis”

$(".hospitalDropDown").change(function(e){
            var querystring=window.location.search;
            var currentURL=$(location).attr('href');
            if(location.href.indexOf('?') == -1) {
                window.location.href= 'http://mysite/events/Pages/default.aspx'+'?hos='+$(this).val();
                }
                else{

                    window.location.href = ( $(this).val() == "All Hospitals" ) ? 'http://mysitesite/events/Pages/default.aspx': location.href +'&hos='+ $(this).val(); }
    )};

我发现一些漂亮的代码使用正则表达式来处理查询字符串，但是我不明白正则表达式是如何工作的。

function replaceQueryString(url,param,value) {
    var re = new RegExp("([?|&])" + param + "=.*?(&|$)","i");
    if (url.match(re))
        return url.replace(re,'$1' + param + "=" + value + '$2');
    else
        return url + '&' + param + "=" + value;
}

最佳答案

您需要执行以下操作:

function replaceQueryString(url,param,value) {
    var re = new RegExp("([?|&])" + param + "=.*?(&|$)","i");
    if (url.match(re))
        return url.replace(re,'$1' + param + "=" + value + '$2');
    else
        return url + '&' + param + "=" + value;
}

$(".hospitalDropDown").change(function(e) {
   window.location.href = replaceQueryString(window.location.href, 'hos', $(this).val());
)};

您发现的replaceQueryString代码段已经打包在一个精巧的小函数中，因此您无需了解任何正则表达式就可以使用它。您需要做的就是将您的网址，要更改的参数(“hos”)和新值传递给该函数。

另外，$(location).attr('href')并不是真正有效的，而且您也没有使用它，因此只需将其取出并坚持使用window.location.href即可。

最后，尽管在这种特殊情况下您不需要任何正则表达式知识，但是一定可以从至少学习一些基本的正则表达式语法中受益。查看http://www.regular-expressions.info/以获得一些很好的解释，然后使用像http://www.regextester.com/这样的正则表达式测试器来试用这些示例并尝试编写自己的示例。