基于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 checkbox,radio是否选中的判断代码
Mar 20 Javascript
容易被忽略的JS脚本特性
Sep 13 Javascript
Jquery选中或取消radio示例
Sep 29 Javascript
JQuery插入DOM节点的方法
Jun 11 Javascript
JavaScript运行过程中的“预编译阶段”和“执行阶段”
Dec 16 Javascript
解决JS内存泄露之js对象和dom对象互相引用问题
Jun 25 Javascript
详解AngularJS跨页面传值(ui-router)
Aug 23 Javascript
jQuery实现文字超过1行、2行或规定的行数时自动加省略号的方法
Mar 28 jQuery
vue-cli项目优化方法- 缩短首屏加载时间
Apr 01 Javascript
JS实现常见的查找、排序、去重算法示例
May 21 Javascript
vue使用pdfjs显示PDF可复制的实现方法
Dec 14 Javascript
解决vue项目router切换太慢问题
Jul 19 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
将OICQ数据转成MYSQL数据
2006/10/09 PHP
php实现将字符串按照指定距离进行分割的方法
2015/03/14 PHP
php实现指定字符串中查找子字符串的方法
2015/03/17 PHP
PHP单例模式详细介绍
2015/07/01 PHP
php打包压缩文件之ZipArchive方法用法分析
2016/04/30 PHP
PHP getDocNamespaces()函数讲解
2019/02/03 PHP
Laravel框架FormRequest中重写错误处理的方法
2019/02/18 PHP
php数组遍历类与用法示例
2019/05/24 PHP
JQuery 选择器、过滤器介绍
2011/02/14 Javascript
JQuery设置文本框和密码框得到焦点时的样式
2013/08/30 Javascript
Angularjs 动态改变title标题(兼容ios)
2016/12/29 Javascript
微信小程序 下拉列表的实现实例代码
2017/03/08 Javascript
js获取当前周、上一周、下一周日期
2017/03/19 Javascript
node.js 抓取代理ip实例代码
2017/04/30 Javascript
Angular 4.x 路由快速入门学习
2017/05/03 Javascript
基于jQuery的左滑出现删除按钮的示例
2017/08/29 jQuery
JavaScript实现简单生成随机颜色的方法
2017/09/21 Javascript
Webpack实战加载SVG的方法
2017/12/26 Javascript
Swiper自定义分页器使用详解
2017/12/28 Javascript
Webpack中publicPath路径问题详解
2018/05/03 Javascript
React中嵌套组件与被嵌套组件的通信过程
2018/07/11 Javascript
JavaScript数组方法的错误使用例子
2018/09/13 Javascript
JS中使用new Option()实现时间联动效果
2018/12/10 Javascript
Nodejs中怎么实现函数的串行执行
2019/03/02 NodeJs
Python笔记(叁)继续学习
2012/10/24 Python
python爬取51job中hr的邮箱
2016/05/14 Python
Python常见MongoDB数据库操作实例总结
2018/07/24 Python
Python实现汇率转换操作
2020/05/03 Python
Desigual美国官方网站:西班牙服装品牌
2019/03/29 全球购物
Molton Brown美国官网:奢华美容、香水、沐浴和身体护理
2020/09/02 全球购物
市场营销专业个人求职信范文
2013/12/14 职场文书
超市5.1促销活动
2014/01/15 职场文书
健康状况证明书
2014/11/26 职场文书
销售助理岗位职责
2015/02/11 职场文书
贫民窟的百万富翁观后感
2015/06/09 职场文书
获奖感言怎么写
2015/07/31 职场文书