Home >Web Front-end >JS Tutorial >How to get url parameters and url plus parameters using jquery

How to get url parameters and url plus parameters using jquery

不言
不言Original
2018-07-02 14:36:595180browse

This article will introduce to you the method of jquery to obtain url parameters and url parameters, and the method of adding parameters in url. This article will introduce to you jquery to obtain url parameters in various ways. Friends who are interested can learn together.

Using jquery to obtain url and using jquery to obtain url parameters are operations we often use. The following is an analysis of the text description and code analysis. Please see below for specific details.

1. It is very simple to obtain the url with jquery. The code is as follows:

window.location.href;

In fact, it only uses the basic window object of javascript and is useless. Knowledge of jquery.

2. jquery is more complicated to obtain url parameters, and regular expressions are required, so it is important to learn javascript regular expressions well

First of all Take a look at how to get a certain parameter in the url simply through JavaScript:

  //获取url中的参数
  function getUrlParam(name) {
   var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)"); //构造一个含有目标参数的正则表达式对象
   var r = window.location.search.substr(1).match(reg); //匹配目标参数
   if (r != null) return unescape(r[2]); return null; //返回参数值
  }

You can get the value of the parameter by passing the parameter name in the url through this function, for example, the url is

http://localhost:33064/WebForm2.aspx?reurl=WebForm1.aspx

If we want to get the value of reurl, we can write like this:

var xx = getUrlParam('reurl');

Understand how javascript gets the url parameters. We can use this method to extend a method for jquery to get url parameters through jquery. The following code extends a getUrlParam() method for jquery

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

After extending this method for jquery, we can use the following method To get the value of a certain parameter:

var xx = $.getUrlParam('reurl');

Full code:

 
 

2014-4-23 Modification

Today when using the above method to get the parameters in the url , the Chinese parameters passed in the URL are garbled no matter how tested they are when parsed. After some debugging, I found that when I passed parameters, I used encodeURI for Chinese character encoding, while the above method used unescape when parsing parameter encoding. Just change it to decodeURI.

Attachment: Introduction in W3School:

JavaScript unescape() function

unescape() function can decode strings encoded by escape().

Parameters Description
string Required. The string to decode or unescape.

说明

该函数的工作原理是这样的:通过找到形式为 %xx 和 %uxxxx 的字符序列(x 表示十六进制的数字),用 Unicode 字符 \u00xx 和 \uxxxx 替换这样的字符序列进行解码。

提示和注释

注释:ECMAScript v3 已从标准中删除了 unescape() 函数,并反对使用它,因此应该用 decodeURI() 和 decodeURIComponent() 取而代之。

综上: javascript对参数编码解码方法要一致:

escape()   unescape()

encodeURI()   decodeURI()

encodeURIComponent()    decodeURIComponent() 

网上找的另一种javascript获取url中参数的方法:

<script language="JavaScript" type="text/javascript"> 
function GetUrlParms() 
{
 var args=new Object(); 
 var query=location.search.substring(1);//获取查询串 
 var pairs=query.split("&");//在逗号处断开 
 for(var i=0;i<pairs.length;i++) 
 { 
  var pos=pairs[i].indexOf(&#39;=&#39;);//查找name=value 
   if(pos==-1) continue;//如果没有找到就跳过 
   var argname=pairs[i].substring(0,pos);//提取name 
   var value=pairs[i].substring(pos+1);//提取value 
   args[argname]=unescape(value);//存为属性 
 }
 return args;
}
var args = new Object();
args = GetUrlParms();
//如果要查找参数key:
if(args["id"]!=undefined)
{
//如果要查找参数key:
var value1 = args["id"] ;
alert(value1);
}</script>

 jquery 取url参数和在url加参数

(function ($) {
 $.extend({
  Request: function (m) {
   var sValue = location.search.match(new RegExp("[\?\&]" + m + "=([^\&]*)(\&?)", "i"));
   return sValue ? sValue[1] : sValue;
  },
  UrlUpdateParams: function (url, name, value) {
   var r = url;
   if (r != null && r != &#39;undefined&#39; && r != "") {
    value = encodeURIComponent(value);
    var reg = new RegExp("(^|)" + name + "=([^&]*)(|$)");
    var tmp = name + "=" + value;
    if (url.match(reg) != null) {
     r = url.replace(eval(reg), tmp);
    }
    else {
     if (url.match("[\?]")) {
      r = url + "&" + tmp;
     } else {
      r = url + "?" + tmp;
     }
    }
   }
   return r;
  }

 });
})(jQuery);

使用方法

dev.zhang.com/IOF.Signup/index_uscn_chs.html?act=1

1、取值使用

$.Request("act") = 1

2、url加参数

$.UrlUpdateParams(window.location.href, "mid", 11111),

结果window.location.href?mid=11111

以上就是本文的全部内容,希望对大家的学习有所帮助,更多相关内容请关注PHP中文网!

相关推荐:

jQuery实现监控页面所有ajax请求的方法

关于jquery ajaxfileuplod 上传文件 essyui laoding的效果

The above is the detailed content of How to get url parameters and url plus parameters using jquery. For more information, please follow other related articles on the PHP Chinese website!

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn