JavaScript 获取 url 上的指定参数值

2024-03-16 17:02:09 浏览数 (1)

假设现在有 A 和 B 两个页面,当我们从 A 页面跳转到 B 页面的时候,需要将 A 页面的两个值传递到 B 页面当中,前端可以通过读取缓存的方式,从 B 页面获取到 A 页面的数据,但这样的方式,会让其他端上的数据不同步,所以我们往往通过 url 传参的方式,在 A 页面跳转到 B 页面的时候,通过字符串拼接的方式,将 A 页面上的值链到 url 上,可参考下面的栗子

A 页面

代码语言:javascript复制
<a href="javascript:void(0);" class="date_btn" data-year="2017" target="_blank">12</a>

$('body').on('click', '.date_btn', function(e){
    e.preventDefault();
    var a_year  = $(this).data('year'),
        a_month = $(this).text(),    
        link    = "index.php?year="   a_year   "&month="   a_month;
    window.location = link;
});

假设 B 页面的链接为 https://www.google.com/index.php?year=2017&month=12,则 B 页面获取参数值的方式如下

代码语言:javascript复制
var date = {
    init: function(){
        this.bindCusEvent();
    },
    getQueryString: function(name) {
        var reg = new RegExp("(^|&)"  name  "=([^&]*)(&|$)"),
            r   = decodeURI(window.location.search).substr(1).match(reg);
        if(r != null){
            return  decodeURI(r[2])
        }else{
            return "";
        }
    },
    bindCusEvent: function() {
        var that  = this,
            b_year  = that.getQueryString('year'),
            b_month = that.getQueryString('month');
        // 利用得到的参数值进行其他操作,如Ajax请求
    }
}

date.init();

0 人点赞