基于JavaScript获取url参数2种方法


Posted in Javascript onApril 17, 2020

这次是使用JavaScript来获取url(request)中的参数

在日常页面编写的过程中为了方便操作在<script>中通过使用window.location.href="要跳转的页面?参数1=" rel="external nofollow" +值1+"&参数2="+值2 来进行页面跳转并传值。

那么在跳转过去的页面怎样在<script>中获取到传过来的参数呢?

下面是小编的一个案例:

//参数传出页面

window.location.href = "Frameset.aspx?name=" + username + "&tbpwd="+tbpwd;//这里是我要将username和tbpwd作为参数传到Frameset.aspx这个页面上

一、字符串分割分析法

//参数接收页面(Frameset.aspx)

 <script type="text/javascript" language="javascript">
    $(function () {
      var url = location.search;       ////获取接收到的url中含"?"符后的字串
      var request = new Object();     //实例化一个对象
      if (url.indexOf("?") != -1) {      //判断“?”后面是否有值
        var str = url.substr(1)       //去掉括?号
        strs = str.split("&");
        for (var i = 0; i < strs.length; i++){
          request[strs[i].split("=")[0]] = unescape(strs[i].split("=")[1]);//将参数和对应的值使用split函数切割出来
        }
      }
 //以此获取url串中所带的同名参数

      alert(request["name"]);
      alert(request["tbpwd"]);
    })
  </script>

二、正则分析法

<script type="text/javascript" language="javascript">
function GetQueryString(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;
}
alert(GetQueryString("参数名1"));
alert(GetQueryString("参数名2"));
</script>

以上两种方法都是可以实现js通过window.location.href进行页面跳转及传参后在跳转后的页面接收到参数!

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
jQuery版仿Path菜单效果
Dec 15 Javascript
在JavaScript中typeof的用途介绍
Apr 11 Javascript
JavaScript中扩展Array contains方法实例
Aug 23 Javascript
原生JavaScript编写俄罗斯方块
Mar 30 Javascript
Javascript闭包实例详解
Nov 29 Javascript
初识angular框架后的所思所想
Feb 19 Javascript
使用BootStrap实现用户登录界面UI
Aug 10 Javascript
利用js的闭包原理做对象封装及调用方法
Apr 07 Javascript
全面介绍vue 全家桶和项目实例
Dec 27 Javascript
AngularJS select加载数据选中默认值的方法
Feb 28 Javascript
vue生成token并保存到本地存储中
Jul 17 Javascript
JS中的算法与数据结构之常见排序(Sort)算法详解
Aug 16 Javascript
VSCode写vue项目一键生成.vue模版,修改定义其他模板的方法
Apr 17 #Javascript
vue fetch中的.then()的正确使用方法
Apr 17 #Javascript
如何基于filter实现网站整体变灰功能
Apr 17 #Javascript
javascript设计模式 ? 解释器模式原理与用法实例分析
Apr 17 #Javascript
javascript设计模式 ? 迭代器模式原理与用法实例分析
Apr 17 #Javascript
vue制作抓娃娃机的示例代码
Apr 17 #Javascript
Vue+tracking.js 实现前端人脸检测功能
Apr 16 #Javascript
You might like
thinkPHP使用pclzip打包备份mysql数据库的方法
2016/04/30 PHP
微信支付PHP SDK ―― 公众号支付代码详解
2016/09/13 PHP
Javascript 文件夹选择框的两种解决方案
2009/07/01 Javascript
Wordpress ThickBox 点击图片显示下一张图的修改方法
2010/12/11 Javascript
40款非常棒的jQuery 插件和制作教程(系列二)
2011/11/02 Javascript
poshytip 基于jquery的 插件 主要用于显示微博人的图像和鼠标提示等
2012/10/12 Javascript
jQuery 无限级菜单的简单实例
2014/02/21 Javascript
jquery实现的导航固定效果
2014/04/28 Javascript
javascript字母大小写转换的4个函数详解
2014/05/09 Javascript
js判断鼠标左、中、右键哪个被点击的方法
2015/01/27 Javascript
js实现缓冲运动效果的方法
2015/04/10 Javascript
coffeescript使用的方式汇总
2015/08/05 Javascript
jQuery动态星级评分效果实现方法
2015/08/06 Javascript
jquery之别踩白块游戏的简单实现
2016/07/25 Javascript
手机端 HTML5使用photoswipe.js仿微信朋友圈图片放大效果
2016/08/25 Javascript
Vue中通过vue-router实现命名视图的问题
2020/04/23 Javascript
Element Carousel 走马灯的具体实现
2020/07/26 Javascript
微信小程序对图片进行canvas压缩的方法示例详解
2020/11/12 Javascript
[01:32]dota2拉比克至宝(222)
2018/12/20 DOTA
Python selenium 三种等待方式详解(必会)
2016/09/15 Python
Python IDLE 错误:IDLE''s subprocess didn''t make connection 的解决方案
2017/02/13 Python
Python编程深度学习绘图库之matplotlib
2018/12/28 Python
详解python selenium 爬取网易云音乐歌单名
2019/03/28 Python
Python generator生成器和yield表达式详解
2019/08/08 Python
详解pyinstaller生成exe的闪退问题解决方案
2020/06/19 Python
python中get和post有什么区别
2020/06/19 Python
值得收藏的HTML5资源(学习html5的朋友可以收藏下)
2010/07/20 HTML / CSS
关于HTML5的安全问题开发人员需要牢记的
2012/06/21 HTML / CSS
Sneaker Studio乌克兰:购买运动鞋
2018/03/26 全球购物
过程装备与控制工程专业个人的求职信
2013/12/01 职场文书
自我介绍演讲稿
2014/01/15 职场文书
父亲的菜园教学反思
2014/02/13 职场文书
供用电专业求职信
2014/07/07 职场文书
2014年安全生产工作总结
2014/11/13 职场文书
比较node.js和Deno
2021/04/27 Javascript