jqueryを使用してURLパラメータとURLとパラメータを取得する方法

不言
リリース: 2018-07-02 14:36:59
オリジナル
5108 人が閲覧しました

この記事では、URLパラメータを取得するjqueryの方法とURLにパラメータを追加する方法を紹介します。興味のある友達は一緒に学ぶことができます

。 URL を取得する、および URL パラメータを取得するために jquery を使用する操作は、テキスト記述とコード分析の形で以下に示します。具体的な詳細については、以下を参照してください。

1. jquery を使用して URL を取得するのは非常に簡単です。コードは次のとおりです:

window.location.href;
ログイン後にコピー

実際には、JavaScript の基本的なウィンドウ オブジェクトのみを使用し、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 を通じて 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() でエンコードされた文字列をデコードできます。

パラメータ説明
文字列は必須です。デコードまたはエスケープ解除する文字列。

说明

该函数的工作原理是这样的:通过找到形式为 %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的效果

以上がjqueryを使用してURLパラメータとURLとパラメータを取得する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート
私たちについて 免責事項 Sitemap
PHP中国語ウェブサイト:福祉オンライン PHP トレーニング,PHP 学習者の迅速な成長を支援します!