如何使用jQuery来操纵查询字符串 [英] How to use jquery to manipulate the querystring

查看:64
本文介绍了如何使用jQuery来操纵查询字符串的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我有一个选择下拉列表,其中ID映射到值. 在onChange事件上,我想重定向到相同的URL,但在查询字符串后附加"id = value".

I have a select dropdown with id's mapped to values. On the onChange event I want to redirect to the same url but with 'id=value' appended to the querystring.

如何检查查询字符串中是否尚未包含此"id"选项(我不需要多个值),并根据需要替换/附加.

How do I check that this 'id' option isn't already in the querystring (I don't want multiple values) and replace / append as necessary.

如何检查是否为?"已经在查询字符串中,如果没有,则追加到URL.

How do I check if '?' is already in the querystring and append to the url if its not.

jquery是否有一种简单的方法来做到这一点?

Is there an easy way with jquery to do this?

对于$().ajax(url, {options})调用,它必须在后台执行类似的操作. 我希望我可以做$().redirect( url, { id : $(this).val() })之类的事情.

It must do something similar under the hood for $().ajax(url, {options}) calls. I was hoping I could just do $().redirect( url, { id : $(this).val() }) or somesuch.

谢谢.

注意:此页面可能传入或传出了几个其他查询选项(在其他表单选项中设置了默认值),因此替换整个查询字符串不是一个选择.

Note: This page may or may not have a few different query options passed in (which set defaults on other form options) so replacing the whole querystring is not an option.

<html>
<head><script type="text/javascript" src="/jquery-1.3.2.min.js"></script></head>
<body>
  <script>
    $(function(){                                                                                                                                         
        $('#selector').change(function(){                                                                                                                 
            // problem if 'id' option already exists
            var url = location.href + '?;id=' + $(this).val();                                                                                            
            location.assign( url );
        });                                                                                                                                               
    });                                                                                                                                                   
  </script>

  <a href="#" onclick="location.assign( location.pathname )">reset</a>                                                                                      
  <form>                                                                                                                                                    
    <select id='selector' name='id'>                                                                                                                      
        <option value='1'>one</option>                                                                                                                    
        <option value='2'>two</option>                                                                                                                    
        <option value='3'>three</option>                                                                                                                  
    </select>                                                                                                                                             
  </form>
</body>
</html>

推荐答案

我最终进行了RegExp匹配以覆盖选项. jQuery.param接受哈希并将其序列化为query_string 但它不提供反函数(分解query_string).

I ended up going with a RegExp match to override the options. jQuery.param takes a hash and serialises it to a query_string but it doesn't provide the inverse (breaking up a query_string).

// put function into jQuery namespace
jQuery.redirect = function(url, params) {

    url = url || window.location.href || '';
    url =  url.match(/\?/) ? url : url + '?';

    for ( var key in params ) {
        var re = RegExp( ';?' + key + '=?[^&;]*', 'g' );
        url = url.replace( re, '');
        url += ';' + key + '=' + params[key]; 
    }  
    // cleanup url 
    url = url.replace(/[;&]$/, '');
    url = url.replace(/\?[;&]/, '?'); 
    url = url.replace(/[;&]{2}/g, ';');
    // $(location).attr('href', url);
    window.location.replace( url ); 
};

然后在HTML中

$('#selector').change(function(){ 
   $.redirect( location.href, { id : $(this).val() })
})

感谢所有人的答复.

这篇关于如何使用jQuery来操纵查询字符串的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆