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

时间:2012-01-20 17:07:34

标签: javascript jquery regex url query-string

我有一个具有双重角色的下拉列表。用户可以直接进入页面(http://mysite/events/Pages/default.aspx)并使用下拉菜单,或者他们可以先进行搜索,然后通过选择下拉列表进一步筛选搜索结果。 第一个案例网址就像 http://mysite/events/Pages/default.aspx?hos=Carmel和 第二个案例URL http://mysite/events/Pages/default.aspx?kwd=health&type=Events&hos=Carmel 这就是我现在正在做的事情,但它表现得很奇怪,并且确实像这样的网址http://mysite.events/Pages/default.aspx?hos=Crown&hos=Carmel

因此,如果用户第一次从下拉列表中选择卡梅尔并决定他/她想要寻找印第安纳波利斯,那么它应该用印第安纳波利斯替换'卡梅尔'或用“&”取代整个querstring“& hos = Carmel” ; hos =印第安纳波利斯“为第二种情况而且”?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;
}

2 个答案:

答案 0 :(得分:7)

你需要做这样的事情:

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/这样的正则表达式测试程序来处理样本并尝试编写自己的一些。

答案 1 :(得分:0)

$(".hospitalDropDown").change(function(e){
    var newhos=($(this).val() == "All Hospitals" ) ? '' : '$1hos=' + $(this).val();
    location.href=location.href.replace(/([\?\&])hos=\w+/,newhos);
});