`

js取当前url参数

    博客分类:
  • JS
 
阅读更多

js没有提供取当前url参数的方法,只能是自己从中截取了,在网上看很多都是split成数组后再匹配。后来找了个用正则写的,感觉很方便就收藏,方便日后使用。现在分享给大家。

Request = {QueryString : function( key ){ 
var svalue = window.location.search.match( new RegExp( "[\?\&]" + key + "=([^\&]*)(\&?)", "i" ) ); 
return svalue ? svalue[1] : svalue; 
} 
}; 

 假设当前链接是http://www.test.com?a=b&c=d;
取c的值用var c=Request.QueryString(“c”);即可取到。

 

 

转载:http://xuedong.iteye.com/blog/1127727

=======================================================================

 

 

JQuery 怎么得到request url中的参数呢?

其实很简单,就是循环遍历url,然后找到“&”这个符号

下面是源代码

Js代码   收藏代码
  1. // Read a page's GET URL variables and return them as an associative array.  
  2. function getUrlVars()  
  3. {  
  4.     var vars = [], hash;  
  5.     var hashes = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&');  
  6.     for(var i = 0; i < hashes.length; i++)  
  7.     {  
  8.         hash = hashes[i].split('=');  
  9.         vars.push(hash[0]);  
  10.         vars[hash[0]] = hash[1];  
  11.     }  
  12.     return vars;  
  13. }  

 

上面是得到URL的数组

 

我们打个比方

 

1.URL如下

Js代码   收藏代码
  1. http://www.example.com/?me=myValue&name2=SomeOtherValue  

 

2.我们在浏览器中可以看到数组如下

Js代码   收藏代码
  1. {  
  2.     "me"    : "myValue",  
  3.     "name2" : "SomeOtherValue"  
  4. }  

 

3.得到相应的参数的值

Js代码   收藏代码
  1. var first = getUrlVars()["me"];  
  2.   
  3. // To get the second parameter  
  4. var second = getUrlVars()["name2"];  

 

下面JQuery的实现

Js代码   收藏代码
  1. $.extend({  
  2.   getUrlVars: function(){  
  3.     var vars = [], hash;  
  4.     var hashes = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&');  
  5.     for(var i = 0; i < hashes.length; i++)  
  6.     {  
  7.       hash = hashes[i].split('=');  
  8.       vars.push(hash[0]);  
  9.       vars[hash[0]] = hash[1];  
  10.     }  
  11.     return vars;  
  12.   },  
  13.   getUrlVar: function(name){  
  14.     return $.getUrlVars()[name];  
  15.   }  
  16. });  

 

 得到相应的值的方法

Js代码   收藏代码
  1. // Get object of URL parameters  
  2. var allVars = $.getUrlVars();  
  3.   
  4. // Getting URL var by its nam  
  5. var byName = $.getUrlVar('name');  

 

 

==================================================================================================

 

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里到底是提供了哪些方法呢,下面我们把它的代码贴出来:

/**
 * 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的附件我也传上。希望这篇文章对大家有所帮助。

 

转载:http://jackjobs.iteye.com/blog/1701665

 

分享到:
评论

相关推荐

    如何用js获取当前url的参数值

    本文将详细介绍一种使用JavaScript来解析并获取当前URL参数的方法。 #### 方法概述 在给定的代码示例中,作者定义了一个名为`request`的函数,该函数接受一个参数`paras`,用于指定想要获取的查询参数名称。函数的...

    js获取url参数

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

    js获取url参数.rar url参数获取

    在JavaScript编程中,获取URL参数是一项常见的任务,特别是在构建动态Web应用时。URL(Uniform Resource Locator)是网页的地址,而URL参数则是附加在URL后面,用于传递额外信息的键值对。这些参数通常以问号(?)...

    nodejs实现获取当前url地址及url各种参数值

    在提供的文件内容中,涉及到了两个关键部分的代码示例,分别是在Node.js中获取当前请求的URL地址和参数值,以及如何使用JavaScript在客户端获取当前URL地址。 首先,我们来看Node.js中如何获取当前请求的URL地址及...

    JS正则表达式替换url参数的方法

    具体代码如下所示: /* 定义替换对象键值 */ var setReferArgs = function(){ .../* 替换URL的参数 */ var replaceUrlParams = function(url){ var actualUrl = ""; var referArgs = setReferArgs(); for(var ke

    JavaScript获取链接url参数并生成对象

    标题"JavaScript获取链接url参数并生成对象"指出了我们需要从URL中提取这些参数,并将它们组织成一个JavaScript对象。这个对象的键将是参数名,值将是对应的参数值。这样做可以方便地对参数进行操作,如遍历、修改或...

    javascript获取url上的参数.rar

    获取URL参数的常用方法是解析这个查询字符串。以下是一种实现方式: ```javascript function getURLParameters(url) { var params = {}; var parser = document.createElement('a'); parser.href = url || ...

    jquery_query_js获取url参数

    总结来说,jQuery Query Object提供了一套简洁的API,用于处理URL参数,它极大地简化了在JavaScript中获取和操作URL参数的工作。通过正确理解和运用这些方法,开发者可以更高效地处理与URL参数相关的各种任务。

    js获取地址栏参数

    通过以上介绍,我们可以看出JavaScript提供了多种获取URL参数的方法。其中正则表达式方法虽然较为传统,但在兼容性和灵活性方面表现良好;而`URLSearchParams` API则更适合现代Web应用的需求。在实际开发中,可以...

    php获取URL中带#号等特殊符号参数的解决方法

    本篇知识点将详细探讨如何在PHP中获取带有特殊符号,如井号(#)的URL参数,并介绍如何使用JavaScript的escape函数对这些特殊字符进行编码,从而实现正确地在服务器端获取这些参数。 首先,我们来看看URL编码的基础...

    javascript将url中的参数加密解密代码

    `Encrypt` 函数用于加密URL参数,而 `Decrypt` 函数则用于解密已加密的数据。 1. **加密过程**: - 首先,函数检查输入的字符串 `str` 是否为空,如果为空则返回空字符串。 - 接着,使用 `escape` 函数对字符串...

    javascript 取Url参数和去掉字符串前后空格方法

    ### JavaScript 获取URL参数和去除字符串前后空格的方法 在日常的Web开发中,经常会遇到需要获取URL中的参数或处理字符串的情况。例如,在用户点击某个链接或者表单提交后,我们可能需要从URL中提取出某些特定的...

    JS 获取当前页面的URL

    它包含了关于当前URL的所有信息,如协议、主机名、路径、查询字符串和哈希值等。以下是一些常用的方法和属性: 1. `window.location.href`:这个属性返回或设置整个URL。例如,如果你的页面URL是`...

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

    为了解决这个问题,我们可以采取一些方法,特别是当使用jQuery来获取URL参数时,有以下两种方法特别有效。 方法一是利用正则表达式来匹配和解析URL参数,这是一种相对直接且有效的方式。具体实现步骤如下: 1. ...

    在页面上取URL参数

    ### 在页面上取URL参数 #### 背景与应用场景 在Web开发中,经常需要从URL中获取特定的参数来实现动态页面的功能或者个性化用户体验。例如,在电子商务网站中,可能会根据URL中的商品ID参数来展示不同的商品详情;...

    页面跳转js获取传递的参数

    #### 方法五:解析URL参数 ```javascript // 解析URL中的参数并存储到数组中 var URLParams = new Array(); var aParams = document.location.search.substr(1).split('&'); for (var i = 0; i ; i++) { var a...

    js实现ifram取父窗口URL地址的方法

    本文介绍的JavaScript方法,就是如何在iframe中实现获取父窗口URL地址的过程。这一过程利用了JavaScript中的window.parent对象,它是iframe元素与父窗口之间的桥梁。 首先,理解window对象在JavaScript中的地位非常...

    JqueryUrl参数获取

    总结,jQuery虽然没有内置的URL参数获取方法,但结合JavaScript的原生API,我们可以轻松实现这一功能。在实际开发中,务必考虑浏览器兼容性,特别是在处理老版本的Internet Explorer时。同时,合理利用URL参数,可以...

    Js日历控件传递url参数

    总的来说,"Js日历控件传递url参数"涉及到客户端JavaScript的事件处理和URL操作,以及服务器端ASP的参数解析和数据库查询。通过这种技术结合,我们可以创建一个能够动态筛选内容的交互式日历,提供更个性化的浏览...

Global site tag (gtag.js) - Google Analytics