`

jquery获取url及起参数列表

 
阅读更多
      在基于B/S的web开发中，我们时常会通过发请求给服务端，来完成所需要的功能。这时候，url就少不了，无参的，带参的，等等。所以在有的时候，我们就需要通过获取当前发送的url的参数，通过这些参数进而完成更多的功能，所以这篇文章我们就会谈到，在不借助其他工具的情况下，用我们的jquery来完成对当前请求的url的参数的获取。

 

      在这里，我就列举出3类的获取参数的方法，其实质，当然，都是类似的。

 

      第一种：1.引用外部js：<script type="text/javascript" src="js/jquery.query.js"></script>

                  2.设置js参数：<script type="text/javascript">

var jQuery.query={numbers:false,hash:true};

 </script>

                  3.调用方法，获得参数：$.query.get(param1),$.query.get(param2),$.query.get(param3)......

 

 

      第二种：1.引用外部js：<script type="text/javascript" src="js/jquery.query.js"></script>

                  2.编写脚本方法：<script type="text/javascript">

function GetQueryString(name) 
{ 
var reg = new RegExp("(^|&)"+ name +"=([^&]*)(&|$)"); 
var r = window.location.search.substr(1).match(reg); 
if (r!=null) return unescape(r[2]); return null; 
}

                                             </script>

                   3.调用方法，获得参数：GetQueryString("param1"),GetQueryString("param2"),GetQueryString("param3").....

 

 

       第三种：1.引用外部js：<script type="text/javascript" src="js/jquery-1.4.2.js"></script>

                   2.编写脚本方法：<script type="text/javascript">

$.extend(

    getUrlVars:function(){

         var vars=[],hash;

         var hashes=window.location.href.slice(window.location.href.indexOf( '?' ) + 1).split( '&' );

         for ( var   i = 0; i < hashes.length; i++)

          {

                hash = hashes[i].split( '=' );

                vars.push(hash[0]);

                vars[hash[0]] = hash[1];

           }

            return vars;

},

     getUrlVar:function(name){

           return $.getUrlVars()[name];

}

);

</script>

    3.调用方法，获得参数：$.getUrlVars();$.getUrlVar( 'name' );

 

 

由上述三种方式可以看出，我们会引用到jquery.query.js这个js文件，这个js里到底是提供了哪些方法呢，下面我们把它的代码贴出来：

Js代码 复制代码 收藏代码
  1. /**  
  2.  * jQuery.query - Query String Modification and Creation for jQuery  
  3.  * Written by Blair Mitchelmore (blair DOT mitchelmore AT gmail DOT com)  
  4.  * Licensed under the WTFPL (http://sam.zoy.org/wtfpl/).  
  5.  * Date: 2009/8/13  
  6.  *  
  7.  * @author Blair Mitchelmore  
  8.  * @version 2.1.6  
  9.  *  
  10.  **/  
  11. new function(settings) {    
  12.   // Various Settings   
  13.   var $separator = settings.separator || '&';   
  14.   var $spaces = settings.spaces === false ? false : true;   
  15.   var $suffix = settings.suffix === false ? '' : '[]';   
  16.   var $prefix = settings.prefix === false ? false : true;   
  17.   var $hash = $prefix ? settings.hash === true ? "#" : "?" : "";   
  18.   var $numbers = settings.numbers === false ? false : true;   
  19.      
  20.   jQuery.query = new function() {   
  21.     var is = function(o, t) {   
  22.       return o != undefined && o !== null && (!!t ? o.constructor == t : true);   
  23.     };   
  24.     var parse = function(path) {   
  25.       var m, rx = /\[([^[]*)\]/g, match = /^([^[]+?)(\[.*\])?$/.exec(path), base = match[1], tokens = [];   
  26.       while (m = rx.exec(match[2])) tokens.push(m[1]);   
  27.       return [base, tokens];   
  28.     };   
  29.     var set = function(target, tokens, value) {   
  30.       var o, token = tokens.shift();   
  31.       if (typeof target != 'object') target = null;   
  32.       if (token === "") {   
  33.         if (!target) target = [];   
  34.         if (is(target, Array)) {   
  35.           target.push(tokens.length == 0 ? value : set(null, tokens.slice(0), value));   
  36.         } else if (is(target, Object)) {   
  37.           var i = 0;   
  38.           while (target[i++] != null);   
  39.           target[--i] = tokens.length == 0 ? value : set(target[i], tokens.slice(0), value);   
  40.         } else {   
  41.           target = [];   
  42.           target.push(tokens.length == 0 ? value : set(null, tokens.slice(0), value));   
  43.         }   
  44.       } else if (token && token.match(/^\s*[0-9]+\s*$/)) {   
  45.         var index = parseInt(token, 10);   
  46.         if (!target) target = [];   
  47.         target[index] = tokens.length == 0 ? value : set(target[index], tokens.slice(0), value);   
  48.       } else if (token) {   
  49.         var index = token.replace(/^\s*|\s*$/g, "");   
  50.         if (!target) target = {};   
  51.         if (is(target, Array)) {   
  52.           var temp = {};   
  53.           for (var i = 0; i < target.length; ++i) {   
  54.             temp[i] = target[i];   
  55.           }   
  56.           target = temp;   
  57.         }   
  58.         target[index] = tokens.length == 0 ? value : set(target[index], tokens.slice(0), value);   
  59.       } else {   
  60.         return value;   
  61.       }   
  62.       return target;   
  63.     };   
  64.        
  65.     var queryObject = function(a) {   
  66.       var self = this;   
  67.       self.keys = {};   
  68.          
  69.       if (a.queryObject) {   
  70.         jQuery.each(a.get(), function(key, val) {   
  71.           self.SET(key, val);   
  72.         });   
  73.       } else {   
  74.         jQuery.each(arguments, function() {   
  75.           var q = "" + this;   
  76.           q = q.replace(/^[?#]/,''); // remove any leading ? || #   
  77.           q = q.replace(/[;&]$/,''); // remove any trailing & || ;   
  78.           if ($spaces) q = q.replace(/[+]/g,' '); // replace +'s with spaces   
  79.              
  80.           jQuery.each(q.split(/[&;]/), function(){   
  81.             var key = decodeURIComponent(this.split('=')[0] || "");   
  82.             var val = decodeURIComponent(this.split('=')[1] || "");   
  83.                
  84.             if (!key) return;   
  85.                
  86.             if ($numbers) {   
  87.               if (/^[+-]?[0-9]+\.[0-9]*$/.test(val)) // simple float regex   
  88.                 val = parseFloat(val);   
  89.               else if (/^[+-]?[0-9]+$/.test(val)) // simple int regex   
  90.                 val = parseInt(val, 10);   
  91.             }   
  92.                
  93.             val = (!val && val !== 0) ? true : val;   
  94.                
  95.             if (val !== false && val !== true && typeof val != 'number')   
  96.               val = val;   
  97.                
  98.             self.SET(key, val);   
  99.           });   
  100.         });   
  101.       }   
  102.       return self;   
  103.     };   
  104.        
  105.     queryObject.prototype = {   
  106.       queryObject: true,   
  107.       has: function(key, type) {   
  108.         var value = this.get(key);   
  109.         return is(value, type);   
  110.       },   
  111.       GET: function(key) {   
  112.         if (!is(key)) return this.keys;   
  113.         var parsed = parse(key), base = parsed[0], tokens = parsed[1];   
  114.         var target = this.keys[base];   
  115.         while (target != null && tokens.length != 0) {   
  116.           target = target[tokens.shift()];   
  117.         }   
  118.         return typeof target == 'number' ? target : target || "";   
  119.       },   
  120.       get: function(key) {   
  121.         var target = this.GET(key);   
  122.         if (is(target, Object))   
  123.           return jQuery.extend(true, {}, target);   
  124.         else if (is(target, Array))   
  125.           return target.slice(0);   
  126.         return target;   
  127.       },   
  128.       SET: function(key, val) {   
  129.         var value = !is(val) ? null : val;   
  130.         var parsed = parse(key), base = parsed[0], tokens = parsed[1];   
  131.         var target = this.keys[base];   
  132.         this.keys[base] = set(target, tokens.slice(0), value);   
  133.         return this;   
  134.       },   
  135.       set: function(key, val) {   
  136.         return this.copy().SET(key, val);   
  137.       },   
  138.       REMOVE: function(key) {   
  139.         return this.SET(key, null).COMPACT();   
  140.       },   
  141.       remove: function(key) {   
  142.         return this.copy().REMOVE(key);   
  143.       },   
  144.       EMPTY: function() {   
  145.         var self = this;   
  146.         jQuery.each(self.keys, function(key, value) {   
  147.           delete self.keys[key];   
  148.         });   
  149.         return self;   
  150.       },   
  151.       load: function(url) {   
  152.         var hash = url.replace(/^.*?[#](.+?)(?:\?.+)?$/, "$1");   
  153.         var search = url.replace(/^.*?[?](.+?)(?:#.+)?$/, "$1");   
  154.         return new queryObject(url.length == search.length ? '' : search, url.length == hash.length ? '' : hash);   
  155.       },   
  156.       empty: function() {   
  157.         return this.copy().EMPTY();   
  158.       },   
  159.       copy: function() {   
  160.         return new queryObject(this);   
  161.       },   
  162.       COMPACT: function() {   
  163.         function build(orig) {   
  164.           var obj = typeof orig == "object" ? is(orig, Array) ? [] : {} : orig;   
  165.           if (typeof orig == 'object') {   
  166.             function add(o, key, value) {   
  167.               if (is(o, Array))   
  168.                 o.push(value);   
  169.               else  
  170.                 o[key] = value;   
  171.             }   
  172.             jQuery.each(orig, function(key, value) {   
  173.               if (!is(value)) return true;   
  174.               add(obj, key, build(value));   
  175.             });   
  176.           }   
  177.           return obj;   
  178.         }   
  179.         this.keys = build(this.keys);   
  180.         return this;   
  181.       },   
  182.       compact: function() {   
  183.         return this.copy().COMPACT();   
  184.       },   
  185.       toString: function() {   
  186.         var i = 0, queryString = [], chunks = [], self = this;   
  187.         var encode = function(str) {   
  188.           str = str + "";   
  189.           if ($spaces) str = str.replace(/ /g, "+");   
  190.           return encodeURIComponent(str);   
  191.         };   
  192.         var addFields = function(arr, key, value) {   
  193.           if (!is(value) || value === false) return;   
  194.           var o = [encode(key)];   
  195.           if (value !== true) {   
  196.             o.push("=");   
  197.             o.push(encode(value));   
  198.           }   
  199.           arr.push(o.join(""));   
  200.         };   
  201.         var build = function(obj, base) {   
  202.           var newKey = function(key) {   
  203.             return !base || base == "" ? [key].join("") : [base, "[", key, "]"].join("");   
  204.           };   
  205.           jQuery.each(obj, function(key, value) {   
  206.             if (typeof value == 'object')    
  207.               build(value, newKey(key));   
  208.             else  
  209.               addFields(chunks, newKey(key), value);   
  210.           });   
  211.         };   
  212.            
  213.         build(this.keys);   
  214.            
  215.         if (chunks.length > 0) queryString.push($hash);   
  216.         queryString.push(chunks.join($separator));   
  217.            
  218.         return queryString.join("");   
  219.       }   
  220.     };   
  221.        
  222.     return new queryObject(location.search, location.hash);   
  223.   };   
  224. }(jQuery.query || {}); // Pass in jQuery.query as settings object   
/**
 * jQuery.query - Query String Modification and Creation for jQuery
 * Written by Blair Mitchelmore (blair DOT mitchelmore AT gmail DOT com)
 * Licensed under the WTFPL (http://sam.zoy.org/wtfpl/).
 * Date: 2009/8/13
 *
 * @author Blair Mitchelmore
 * @version 2.1.6
 *
 **/
new function(settings) { 
  // Various Settings
  var $separator = settings.separator || '&';
  var $spaces = settings.spaces === false ? false : true;
  var $suffix = settings.suffix === false ? '' : '[]';
  var $prefix = settings.prefix === false ? false : true;
  var $hash = $prefix ? settings.hash === true ? "#" : "?" : "";
  var $numbers = settings.numbers === false ? false : true;
  
  jQuery.query = new function() {
    var is = function(o, t) {
      return o != undefined && o !== null && (!!t ? o.constructor == t : true);
    };
    var parse = function(path) {
      var m, rx = /\[([^[]*)\]/g, match = /^([^[]+?)(\[.*\])?$/.exec(path), base = match[1], tokens = [];
      while (m = rx.exec(match[2])) tokens.push(m[1]);
      return [base, tokens];
    };
    var set = function(target, tokens, value) {
      var o, token = tokens.shift();
      if (typeof target != 'object') target = null;
      if (token === "") {
        if (!target) target = [];
        if (is(target, Array)) {
          target.push(tokens.length == 0 ? value : set(null, tokens.slice(0), value));
        } else if (is(target, Object)) {
          var i = 0;
          while (target[i++] != null);
          target[--i] = tokens.length == 0 ? value : set(target[i], tokens.slice(0), value);
        } else {
          target = [];
          target.push(tokens.length == 0 ? value : set(null, tokens.slice(0), value));
        }
      } else if (token && token.match(/^\s*[0-9]+\s*$/)) {
        var index = parseInt(token, 10);
        if (!target) target = [];
        target[index] = tokens.length == 0 ? value : set(target[index], tokens.slice(0), value);
      } else if (token) {
        var index = token.replace(/^\s*|\s*$/g, "");
        if (!target) target = {};
        if (is(target, Array)) {
          var temp = {};
          for (var i = 0; i < target.length; ++i) {
            temp[i] = target[i];
          }
          target = temp;
        }
        target[index] = tokens.length == 0 ? value : set(target[index], tokens.slice(0), value);
      } else {
        return value;
      }
      return target;
    };
    
    var queryObject = function(a) {
      var self = this;
      self.keys = {};
      
      if (a.queryObject) {
        jQuery.each(a.get(), function(key, val) {
          self.SET(key, val);
        });
      } else {
        jQuery.each(arguments, function() {
          var q = "" + this;
          q = q.replace(/^[?#]/,''); // remove any leading ? || #
          q = q.replace(/[;&]$/,''); // remove any trailing & || ;
          if ($spaces) q = q.replace(/[+]/g,' '); // replace +'s with spaces
          
          jQuery.each(q.split(/[&;]/), function(){
            var key = decodeURIComponent(this.split('=')[0] || "");
            var val = decodeURIComponent(this.split('=')[1] || "");
            
            if (!key) return;
            
            if ($numbers) {
              if (/^[+-]?[0-9]+\.[0-9]*$/.test(val)) // simple float regex
                val = parseFloat(val);
              else if (/^[+-]?[0-9]+$/.test(val)) // simple int regex
                val = parseInt(val, 10);
            }
            
            val = (!val && val !== 0) ? true : val;
            
            if (val !== false && val !== true && typeof val != 'number')
              val = val;
            
            self.SET(key, val);
          });
        });
      }
      return self;
    };
    
    queryObject.prototype = {
      queryObject: true,
      has: function(key, type) {
        var value = this.get(key);
        return is(value, type);
      },
      GET: function(key) {
        if (!is(key)) return this.keys;
        var parsed = parse(key), base = parsed[0], tokens = parsed[1];
        var target = this.keys[base];
        while (target != null && tokens.length != 0) {
          target = target[tokens.shift()];
        }
        return typeof target == 'number' ? target : target || "";
      },
      get: function(key) {
        var target = this.GET(key);
        if (is(target, Object))
          return jQuery.extend(true, {}, target);
        else if (is(target, Array))
          return target.slice(0);
        return target;
      },
      SET: function(key, val) {
        var value = !is(val) ? null : val;
        var parsed = parse(key), base = parsed[0], tokens = parsed[1];
        var target = this.keys[base];
        this.keys[base] = set(target, tokens.slice(0), value);
        return this;
      },
      set: function(key, val) {
        return this.copy().SET(key, val);
      },
      REMOVE: function(key) {
        return this.SET(key, null).COMPACT();
      },
      remove: function(key) {
        return this.copy().REMOVE(key);
      },
      EMPTY: function() {
        var self = this;
        jQuery.each(self.keys, function(key, value) {
          delete self.keys[key];
        });
        return self;
      },
      load: function(url) {
        var hash = url.replace(/^.*?[#](.+?)(?:\?.+)?$/, "$1");
        var search = url.replace(/^.*?[?](.+?)(?:#.+)?$/, "$1");
        return new queryObject(url.length == search.length ? '' : search, url.length == hash.length ? '' : hash);
      },
      empty: function() {
        return this.copy().EMPTY();
      },
      copy: function() {
        return new queryObject(this);
      },
      COMPACT: function() {
        function build(orig) {
          var obj = typeof orig == "object" ? is(orig, Array) ? [] : {} : orig;
          if (typeof orig == 'object') {
            function add(o, key, value) {
              if (is(o, Array))
                o.push(value);
              else
                o[key] = value;
            }
            jQuery.each(orig, function(key, value) {
              if (!is(value)) return true;
              add(obj, key, build(value));
            });
          }
          return obj;
        }
        this.keys = build(this.keys);
        return this;
      },
      compact: function() {
        return this.copy().COMPACT();
      },
      toString: function() {
        var i = 0, queryString = [], chunks = [], self = this;
        var encode = function(str) {
          str = str + "";
          if ($spaces) str = str.replace(/ /g, "+");
          return encodeURIComponent(str);
        };
        var addFields = function(arr, key, value) {
          if (!is(value) || value === false) return;
          var o = [encode(key)];
          if (value !== true) {
            o.push("=");
            o.push(encode(value));
          }
          arr.push(o.join(""));
        };
        var build = function(obj, base) {
          var newKey = function(key) {
            return !base || base == "" ? [key].join("") : [base, "[", key, "]"].join("");
          };
          jQuery.each(obj, function(key, value) {
            if (typeof value == 'object') 
              build(value, newKey(key));
            else
              addFields(chunks, newKey(key), value);
          });
        };
        
        build(this.keys);
        
        if (chunks.length > 0) queryString.push($hash);
        queryString.push(chunks.join($separator));
        
        return queryString.join("");
      }
    };
    
    return new queryObject(location.search, location.hash);
  };
}(jQuery.query || {}); // Pass in jQuery.query as settings object

 

      由源码我们可以看出，之前调用的它的东西，在源码中都有定义，如get()方法，load()方法，toString()方法等等。它里面提供了众多的扩展方法，这个就有待大家一起去研究使用。例如：

      1. 想获取test，则在引入该js后，使用如下方式获取：var value=$.query.get('key');

      2. 参数列表的名称相同，则可以这样，var arrValues=$.query.get("key");  arr=[value1,value2,value3....]

      3. 参数列表的名称相同，想获取第二个参数，var value2=$.query.get("key[1]")

      4. 设置参数，var newKey=$.query.set("name","zhangsan").toString();  newKey : "?name=zhangsan"

      5. 设置两个参数，var newKeys=$.query.set("name","zhangsan").set("age",23).toString();  newKeys : "?name=zhangsan && age=23"

      6. 删除一个参数：var deleteKey=$.query.REMOVE("sex");

      7. 清空所有的参数：var emptyKey=$.query.empty();

      8. 复制所有参数：var copyKeys=$.query.copy();

等等以上很多，更多的源自于对源码的研究和利用，这些就靠大家自己去琢磨了，实在没有你想要的，自己再这个基础上再添加自己的想要的代码也是可以的，该js的附件我也传上。希望这篇文章对大家有所帮助。

分享到：
| ORA-12519,TNS:no appropriate service han ...
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

    Jquery 获取url参数

    本篇文章将深入探讨如何使用jQuery来获取URL参数，并给出实际的应用示例。 首先，我们需要理解URL的组成部分。一个完整的URL通常由协议（如http或https）、域名、路径和查询字符串组成。查询字符串是URL中"?"后面的...

    Jquery获取URL中的参数、URL、网页地址及路径

    jQuery插件Query URL Parser用于解析URLs字符串。通过它我们可以方便地获取协议、主机、端口、查询参数、文件名、路径等等。在一些静态页面需要根据参数来调整一些内容的时候这个插件还是挺有用的。

    jquery获取URL中参数解决中文乱码问题的两种方法

    以上就是解决在使用jQuery获取URL参数时出现中文乱码问题的两种方法，以及相关的编码和解码处理方式。需要注意的是，乱码问题的出现主要是由于编码和解码不一致导致的，所以在前后端处理URL参数时，一定要注意正确地...

    使用jquery获取url及url参数的简单实例

    最后，文章还提供了一个完整的示例代码，包含了引入jQuery库的脚本标签以及使用jQuery获取URL参数的完整过程。这个示例展示了如何通过jQuery扩展方法来获取URL参数，并通过alert函数显示参数值。 总结以上知识点，...

    js获取url参数

    本文将详细介绍一种利用自定义函数`getUrlParam`来获取URL参数的方法，并对其进行深入解析。 #### 二、基础知识回顾 ##### 2.1 URL 结构 URL（Uniform Resource Locator）是统一资源定位符，用于标识互联网上的...

    jquery_query_js获取url参数

    在本篇文章中，我们将深入探讨如何使用jQuery Query Object来获取URL参数，并结合实际示例进行详细讲解。 首先，要使用jQuery Query Object，你需要确保已经在项目中引入了jQuery库和jQuery Query插件。通常，你...

    JqueryUrl参数获取

    二、jQuery获取URL参数的方法 在jQuery中，没有内置的函数专门用于获取URL参数。但是，可以结合JavaScript的`location.search`和字符串处理方法来实现这一功能。以下是一个简单的实现： ```javascript function ...

    javascript/jquery获取地址栏url参数的方法

    使用jquery获取url以及使用jquery获取url参数是我们经常要用到的操作 1、jquery获取url很简单，代码如下 代码如下:[removed].href; 其实只是用到了javascript的基础的window对象，并没有用jquery的知识 2、jquery...

    html页面动态获取连接参数 jquery.params.js

    总结，`jquery.params.js`扩展使得在HTML页面中动态获取、修改和操作URL参数变得简单。通过引入这个文件并利用`$.query`方法，我们可以方便地处理页面间的数据传递，提高页面的交互性。在实际开发中，这种功能常用于...

    使用jquery获取url以及jquery获取url参数的实现方法

    获取URL参数的操作较为复杂，需要用到正则表达式来匹配特定的参数。 JavaScript中没有专门用于处理URL参数的内建函数，但我们可以通过编写函数来实现这一需求。下面是一个通用的函数，它使用正则表达式来提取指定...

    jQuery获取URL请求参数的方法

    7. URL参数的获取方法：在这个例子中，提供了两种获取URL请求参数的方法，一种是获取所有的请求参数，另一种是根据参数名获取特定的请求参数。获取所有请求参数的方法是通过循环将所有参数添加到数组和对象中，获取...

    jquery获取url参数及url加参数的方法

    ### jQuery获取URL参数的方法 从URL获取参数，通常指的是从当前页面的地址栏中获取查询字符串（query string）里的特定参数值。在不使用jQuery的情况下，我们可以直接通过JavaScript内置的`window.location.href`...

    jQuery 获取URL参数的插件

    例如 当前你的URL是： //www.jb51.net/index.php?test=1&kk=2 如果想获取test，则可以引入插件后， 用如下方法获取： var test = $.query.get(‘test’); 如果参数有多个相同的名称 ，则可以这样： var arr = $....

    #JQuery 最简单动态获取Url上的参数.md

    JQuery 最简单动态获取Url上的参数

    jQuery.url.js

    js通过url获取参数，并返回参数列表或指定参数名的参数值

Magicbox
Global site tag (gtag.js) - Google Analytics