关于获取URL中传值的解决方法

  在我们页面的URL中包含着很多信息,包括域名,协议等等这里就不一一介绍了),对于我们开发者而言,使用比较多的就是页面之间的传值。为什么要页面传值呢?很简单,当你在浏览一个商品页面的时候你要看到一个商品的具体信息,当你点击某个图片的时候,需要告诉后台我点击的是哪个页面,对于前端就是说我要知道我点击的要发送哪个ajax,或者是ajax 的传参是哪个。

  当然我们的方法是比较多的,可以利用cookies,也可以用localstorage。但是杀鸡焉用牛刀呢。我们仅仅是要穿一个商品的ID,他可能就是一个两位的数字,或者一个小小的字符串。所以URL传值是个不错的选择。(https://item.taobao.com/item.htm?spm=a219e.1191392.1111.6.ADZSSq&id=14628943608&scm=1029.newlist-0.1.50002766&ppath=&sku=&ug=#detail)这是淘宝的一个链接,其中的ID为商品的ID,获取页面id后面的数字,就能知道是哪个商品,就能调取后台的数据,来进行后面一系列的操作。所以我们要截取这段数字。有两个比较常用的办法。

方法一:

function getParam(name) {
var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");
var r = window.location.search.substr(1).match(reg);
if(r != null) return unescape(r[2]);
return null;
}

这里是用正则的办法截取字符串,然后再通过unescape的方法,转义字符串,得到相应的数据。这种方法的优点是简单,但是不容易自己理解,毕竟正则验证不是每个人都能理解透的。

方法二:

function GetRequest() {
var url = location.search; //获取url中"?"符后的字串
var theRequest = new Object();
if(url.indexOf("?") != -1) {
var str = url.substr(1);
strs = str.split("&");
for(var i = 0; i < strs.length; i++) {
theRequest[strs[i].split("=")[0]] = unescape(strs[i].split("=")[1]);
}
}
return theRequest;
}

  这种方法就比较好理解了,虽然代码量多一点,但是理解起来比较容易。这里返回的theRequest是一个JSON格式,想用谁就直接点上谁就可以了。

说了这么多就是想分享点代码和方法给大家。但是页面间的传值也不是万能的。比如说他不能传一个对象,而且在地址栏的传值是可见的,可能会导致不安全。但是在不考虑前两者的前提下,用的还是非常的开心的。比如我们现在写的基于钉钉的HTML。这中传值就是非常好的,把上面两个方法写到公共JS中,谁用谁就调取。very good

17:53:52

posted @ 2017-02-20 17:54  程先生哈  阅读(4955)  评论(1编辑  收藏  举报