关注微信公众号 太平洋学习网 扫描二维码
最新消息:关注【太平洋学习网】微信公众号,可以获取全套资料,【全套Java基础27天】【JavaEE就业视频4个月】【Android就业视频4个月】

js截取url网址参数值示例详解

扩展 太平洋学习网 浏览 评论

 有时候我们需要不经过后台就把参数值传递到下一个html页面,这个时候需要用js截取url网址参数值,先来从简单的开始,我们点击跳转到下一html页面,并把参数带过去,如下。

A页面html代码部分:

<a href=>点击跳转</a>

然后我们在目标B页面中使用js来获取上面url参数值,我将代码写在了jquery初始化方法中了,如下所示。

$(function() {
 //回显数据
 var thisURL = document.URL;
 var getval =thisURL.split('?')[1]; //userid=123456
 var userid= getval.split("=")[1];  //123456

});

当然了,上面的js只是简单的在html页面之前传递参数,如果url参数值比较多的话,使用上面的js截取就不行了,因为它只能截取一个url参数值,所以我们来加大难度。

将A页面的html代码改一下,如下:

<a href="http://www.baidu.com/edit?userid=123456&name=zhangsan&age=40">点击跳转</a>

这个时候我们可以使用下面的js正则表达式,在目标页面,将截取url参数值的方法封装一下,会方便很多,复制过去即可使用!

//截取url参数值的函数
function getParameterByName(name, url) {
    if (!url) url = window.location.href;
    name = name.replace(/[\[\]]/g,"\\$&");
    var regex = new RegExp("[?&]" + name + "(=([^&#]*)|&|#|$)"),
    results = regex.exec(url);
    if (!results) return null;
    if (!results[2]) return '';
    return decodeURIComponent(results[2].replace(/\+/g, " "));

}

这个时候我们获取上面url多参数值(如:userid=123456&name=zhangsan&age=40),就非常的方便了,可以如下这样获取。

var userid = getParameterByName("userid"); // 得到123456参数

var name = getParameterByName("name"); // 得到zhangsan参数

var age = getParameterByName("age"); // 得到age参数

html页面跳转专递参数值,就可以使用上面的js函数来截取url参数值就ok了。

如果已经解决了你的js问题,请记得转载或收藏哦!

来源网站:太平洋学习网,转载请注明出处:http://www.tpyyes.com/a/kuozhan/2017/1117/385.html