Heim > Web-Frontend > js-Tutorial > Hauptteil

So erhalten Sie URL-Parameter und URL-Plus-Parameter mithilfe von JQuery

不言
Freigeben: 2018-07-02 14:36:59
Original
5108 Leute haben es durchsucht

Dieser Artikel stellt Ihnen die Methode von jquery zum Abrufen von URL-Parametern und die Methode zum Hinzufügen von Parametern in URL vor. In diesem Artikel werden Ihnen Freunde vorgestellt, die daran interessiert sind, jquery zu erhalten Gemeinsam lernen

Die Verwendung von jquery zum Abrufen von URLs und die Verwendung von jquery zum Abrufen von URL-Parametern sind Vorgänge, die wir häufig verwenden. Nachfolgend finden Sie eine Analyse in Form einer Textbeschreibung und einer Codeanalyse.

1. Es ist sehr einfach, die URL mit jquery abzurufen. Der Code lautet wie folgt:

window.location.href;
Nach dem Login kopieren

Tatsächlich wird nur verwendet Das grundlegende Fensterobjekt von Javascript, das nutzlos ist. Kenntnisse über JQuery.

2. Das Abrufen von URL-Parametern mit jquery ist komplizierter und erfordert die Verwendung regulärer Ausdrücke. Daher ist es wichtig, reguläre Javascript-Ausdrücke gut zu lernen

Schauen Sie sich zunächst an, wie Sie einen bestimmten Parameter in der URL einfach über JavaScript erhalten:

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

Indem Sie den Parameternamen in der URL über diese Funktion übergeben, können Sie den Wert des Parameters erhalten. Die URL lautet beispielsweise

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

Wir möchten den Wert von reurl erhalten, wir können so schreiben:

var xx = getUrlParam('reurl');
Nach dem Login kopieren

Verstehen Sie die Methode von Javascript zum Abrufen von URL-Parametern. Wir können diese Methode verwenden, um eine Methode für jquery zu erweitern, um URL-Parameter über jquery abzurufen. Der folgende Code erweitert eine getUrlParam()-Methode für 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);
Nach dem Login kopieren

Nachdem wir diese Methode für JQuery erweitert haben, können wir die folgende Methode verwenden, um den Wert eines bestimmten Parameters zu erhalten:

var xx = $.getUrlParam('reurl');
Nach dem Login kopieren

Vollständiger Code:

 
 
Nach dem Login kopieren

2014-4-23 Modifikation

Wenn ich heute die obige Methode verwende, um die Parameter in der URL abzurufen, sind die in der URL übergebenen chinesischen Parameter verstümmelt, egal wie getestet sie beim Parsen sind. Nach einigem Debuggen stellte ich fest, dass ich beim Übergeben von Parametern encodeURI für die Codierung chinesischer Zeichen verwendet habe, während die obige Methode beim Parsen der Parametercodierung unescape verwendet habe. Ändern Sie es einfach in decodeURI.

Anhang: Einführung in W3School:

JavaScript unescape()-Funktion

unescape()-Funktion kann von escape() codierte Zeichenfolgen dekodieren.

参数描述
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(&#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>
Nach dem Login kopieren

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);
Nach dem Login kopieren

使用方法

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的效果

Das obige ist der detaillierte Inhalt vonSo erhalten Sie URL-Parameter und URL-Plus-Parameter mithilfe von JQuery. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage
Über uns Haftungsausschluss Sitemap
Chinesische PHP-Website:Online-PHP-Schulung für das Gemeinwohl,Helfen Sie PHP-Lernenden, sich schnell weiterzuentwickeln!