jquery取得url與url參數方法詳解

這次帶給大家jquery獲取url與url參數方法詳解，jquery獲取url與url參數的注意事項有哪些，下面就是實戰案例，一起來看一下。

使用jquery取得url以及使用jquery取得url參數是我們經常要用到的運算

1、jquery取得url很簡單，程式碼如下：

window.location.href;

其實只是用到了javascript的基礎的window物件，並沒有用jquery的知識。

2、jquery取得url參數比較複雜，要用到正規表示式，所以學好javascript正則式多麼重要的事情

##首先看看單純的透過javascript是如何來取得url中的某個參數：

//获取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; //返回参数值
    }

透過這個函數傳遞url中的參數名稱就可以取得到參數的值，例如url為

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

我們要取得reurl的值，可以這樣寫：

var xx = getUrlParam('reurl');

明白了javascript取得url參數的方法，我們可以透過這個方法為jquery擴展一個方法來透過jquery取得url參數，下面的程式碼為jquery擴展了一個getUrlParam()方法

(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);

為jquery擴展了這個方法了之後我們就可以透過以下方法來取得某個參數的值了：

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

完整程式碼：

2014-4-23 修改

今天在用上面的方法取得url中的參數時，url中傳遞的中文參數在解析的時候無論怎麼測試，取得的都是亂碼。經過一番調試後發現，我再傳遞參數時，對漢字編碼使用的是 encodeURI ，而上面的方法在解析參數編碼時使用的是unescape ,修改為 decodeURI 就可以了。

附： W3School中的介紹：

JavaScript unescape() 函數

定義與用法

unescape() 函數可對透過escape() 編碼的字串進行解碼。

參數描述#string必要。要解碼或反轉義的字串。

說明

該函數的工作原理是這樣的：透過找到形式為%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('=');//查找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>

相信看了本文案例你已經掌握了方法，更多精彩請關注php中文網其它相關文章！

推薦閱讀：

iframe中頁面錨點失效如何處理

取得iframe中document物件步驟詳解

以上是jquery取得url與url參數方法詳解的詳細內容。更多資訊請關注PHP中文網其他相關文章！