• jquery获取url参数


    使用jquery获取url以及使用jquery获取url参数是我们经常要用到的操作,下面通过文字说明加代码分析的形式给大家解析,具体详情请看下文。

    1、jquery获取url很简单,代码如下:

    window.location.href;

    其实只是用到了javascript的基础的window对象,并没有用jquery的知识。

    2、jquery获取url参数比较复杂,要用到正则表达式

    首先看看单纯的通过javascript是如何来获取url中的某个参数:

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

    通过这个函数传递url中的参数名就可以获取到参数的值,比如url为

    http://local:3000/qxmkclq/index.html?vid=015da6f7e74efdfe6557a032bc9740

    我们要获取vid的值,可以这样写:

    var xx = getUrlParam('vid');

    明白了javascript获取url参数的方法,我们可以通过这个方法为jquery扩展一个方法来通过jquery获取url参数,下面的代码为jquery扩展了一个getUrlParam()方法

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

    为jquery扩展了这个方法了之后我们就可以通过如下方法来获取某个参数的值了:

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

    完整代码:

    1. <script src="//cdn.staticfile.org/jquery/1.8.0/jquery-1.8.0.min.js" type="text/javascript">script>
    2. <script>
    3. $(function () {
    4. //方法二:
    5. (function ($) {
    6. $.getUrlParam = function (name) {
    7. var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
    8. var r = window.location.search.substr(1).match(reg);
    9. if (r != null) return unescape(r[2]); return null;
    10. }
    11. })(jQuery);
    12. //方法二:
    13. var xx = $.getUrlParam('reurl');
    14. //方法一:
    15. var xx2 = getUrlParam('reurl');
    16. alert(xx);
    17. });
    18. //方法一:
    19. //获取url中的参数
    20. function getUrlParam(name) {
    21. var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)"); //构造一个含有目标参数的正则表达式对象
    22. var r = window.location.search.substr(1).match(reg); //匹配目标参数
    23. if (r != null) return unescape(r[2]); return null; //返回参数值
    24. }
    25. script>

  • 相关阅读:
    图表控件LightningChart使用教程:多线程数据可视化应用程序介绍
    SpringCloud Ribbon / Feign
    2022年09月 Python(一级)真题解析#中国电子学会#全国青少年软件编程等级考试
    rust学习特殊的地方——函数返回值
    java this用法
    mybatis缓存知多少
    配置 rust国内源
    L. Lemper Cooking Competition(前缀和/逆序对/树状数组/归并排序)
    安装rabbitMQ
    【复盘】接口自动化测试框架建设的经验与教训!
  • 原文地址:https://blog.csdn.net/linghunyoushou/article/details/134422166