基于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 相关文章推荐
JSON 编辑器实现代码
Dec 06 Javascript
收集的10个免费的jQuery相册
Feb 26 Javascript
DOM和XMLHttpRequest对象的属性和方法整理
Jan 04 Javascript
用js控制组织结构图可以任意拖拽到指定位置
Jan 17 Javascript
一个小例子解释如何来阻止Jquery事件冒泡
Jul 17 Javascript
深入浅出理解javaScript原型链
May 09 Javascript
jquery实现清新实用的网页菜单效果
Aug 28 Javascript
超全面的vue.js使用总结
Feb 12 Javascript
js中的闭包学习心得
Feb 06 Javascript
koa socket即时通讯的示例代码
Sep 07 Javascript
浅谈Vue2.4.0 $attrs与inheritAttrs的具体使用
Mar 08 Javascript
vue3中轻松实现switch功能组件的全过程
Jan 07 Vue.js
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
解析PHP跨站刷票的实现代码
2013/06/18 PHP
linux使用crontab实现PHP执行计划定时任务
2014/05/10 PHP
PHP中使用strpos函数实现屏蔽敏感关键字功能
2014/08/21 PHP
Yii框架中 find findAll 查找出制定的字段的方法对比
2014/09/10 PHP
利用PHP获取访客IP、地区位置、浏览器及来源页面等信息
2017/06/27 PHP
php两点地理坐标距离的计算方法
2018/12/29 PHP
清除网页历史记录,屏蔽后退按钮!
2008/12/22 Javascript
JS 树形递归实例代码
2010/05/18 Javascript
强大的jquery插件jqeuryUI做网页对话框效果!简单
2011/04/14 Javascript
gridview生成时如何去掉style属性中的border-collapse
2014/09/30 Javascript
js实现鼠标滑过文字链接色彩变化的效果
2015/05/06 Javascript
jquery实现滑动特效代码
2015/08/10 Javascript
BootStrap下拉框在firefox浏览器界面不友好的解决方案
2016/08/18 Javascript
BootstrapTable加载按钮功能实例代码详解
2017/09/22 Javascript
Vue 解决通过this.$refs来获取DOM或者组件报错问题
2020/07/28 Javascript
微信小程序调用后台service教程详解
2020/11/06 Javascript
Jquery+javascript实现支付网页数字键盘
2020/12/21 jQuery
[07:37]DOTA2-DPC中国联赛2月2日Recap集锦
2021/03/11 DOTA
Python使用MySQLdb for Python操作数据库教程
2014/10/11 Python
Perl中著名的Schwartzian转换问题解决实现
2015/06/02 Python
Python3生成手写体数字方法
2018/01/30 Python
详解Python 函数如何重载?
2019/04/23 Python
pyqt5 tablewidget 利用线程动态刷新数据的方法
2019/06/17 Python
Python转换itertools.chain对象为数组的方法
2020/02/07 Python
自定义实现 PyQt5 下拉复选框 ComboCheckBox的完整代码
2020/03/30 Python
Python数据相关系数矩阵和热力图轻松实现教程
2020/06/16 Python
python 实现的IP 存活扫描脚本
2020/12/10 Python
英国DIY汽车维修配件网站:DIY Car Service Parts
2019/08/30 全球购物
室内设计专业学生的自我评价分享
2013/11/27 职场文书
客户服务经理岗位职责
2014/01/29 职场文书
2014年元旦感言
2014/03/06 职场文书
入职担保书范文
2014/05/21 职场文书
初中生散播谣言检讨书
2014/11/17 职场文书
中标通知书范本
2015/04/17 职场文书
社区低保工作总结2015
2015/07/23 职场文书
2016师德师风学习心得体会
2016/01/12 职场文书