How to get url parameters using jquery?

Method: First use "new RegExp("(^|&)" name "=([^&]*)(&|$)")" to construct a regular object containing the target parameters; then use "location.search.substr(1).match()" matches the target parameter; finally return the parameter value.

The operating environment of this tutorial: Windows 7 system, jquery version 3.2.1. This method is suitable for all brands of computers.

Related recommendations: "jQuery Tutorial"

How to use jquery to obtain url and url parameters

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 does not use the knowledge of jquery.

2. It is more complicated to get url parameters with jquery. Regular expressions are used, so it is important to learn javascript regular expressions.

First, let’s take a look at how to get the url simply through javascript. A certain parameter of:

   //获取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 the method of javascript to get url parameters, we can use this method to jquery extends a method to obtain 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 obtain a certain parameter through the following method Value:

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

Full code:

<script>
        $(function () {

            //方法二：
            (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);

            //方法二：
            var xx = $.getUrlParam(&#39;reurl&#39;);

            //方法一：
            // var xx = getUrlParam(&#39;reurl&#39;);


            alert(xx);

        });

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


 </script>

JavaScript unescape() function

Definition and usage

unescape() function decodes a string encoded by escape().

##stringRequired. The string to decode or unescape.

Parameters	Description

Explanation

The function works like this: by finding the character sequence of the form %xx and %uxxxx ( x represents a hexadecimal number), replacing such character sequences with the Unicode characters \u00xx and \uxxxx for decoding.

Tips and Notes

Notes:

ECMAScript v3 has removed the unescape() function from the standard and deprecated its use, so decodeURI() should be used and decodeURIComponent() instead.

To summarize: JavaScript must have the same encoding and decoding methods for parameters:

• escape() and unescape()

• encodeURI() and decodeURI()

• encodeURIComponent() and decodeURIComponent()

For more programming related knowledge, please visit:

Programming Video Course! !

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