基于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 相关文章推荐
js 获取Listbox选择的值的代码
Apr 15 Javascript
一个简单的js树形菜单
Dec 09 Javascript
jQuery提交表单ajax查询实例代码
Oct 07 Javascript
jQuery删除节点的三个方法即remove()detach()和empty()
Dec 27 Javascript
JS实现针对给定时间的倒计时功能示例
Apr 11 Javascript
gulp教程_从入门到项目中快速上手使用方法
Sep 14 Javascript
理理Vue细节(推荐)
Apr 16 Javascript
Angular中使用ng-zorro图标库部分图标不能正常显示问题
Apr 22 Javascript
layui框架与SSM前后台交互的方法
Sep 12 Javascript
js将URL网址转为16进制加密与解密函数
Mar 04 Javascript
基于JavaScript实现控制下拉列表
May 08 Javascript
React实现轮播效果
Aug 25 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
获取用户Ip地址通用方法与常见安全隐患(HTTP_X_FORWARDED_FOR)
2013/06/01 PHP
PHP开源开发框架ZendFramework使用中常见问题说明及解决方案
2014/06/12 PHP
php简单实现屏蔽指定ip段用户的访问
2015/04/29 PHP
thinkphp表单上传文件并将文件路径保存到数据库中
2016/07/28 PHP
PHP扩展Swoole实现实时异步任务队列示例
2019/04/13 PHP
PHP中__set()实例用法和基础讲解
2019/07/23 PHP
yii框架使用分页的方法分析
2019/07/25 PHP
PHP设计模式之建造者模式(Builder)原理与用法案例详解
2019/12/12 PHP
通过js脚本复制网页上的一个表格的不错实现方法
2006/12/29 Javascript
getElementByIdx_x js自定义getElementById函数
2012/01/24 Javascript
JS实现图片预加载无需等待
2012/12/21 Javascript
JS 获取滚动条高度示例代码
2013/10/24 Javascript
怎么判断js脚本加载完成
2014/02/28 Javascript
javascript中字体浮动效果的简单实例演示
2015/11/18 Javascript
基于JavaScript判断浏览器到底是关闭还是刷新(超准确)
2016/02/01 Javascript
JavaScript中的await/async的作用和用法
2016/10/31 Javascript
Angular2 Service实现简单音乐播放器服务
2017/02/24 Javascript
JS实现简单的天数计算器完整实例
2017/04/28 Javascript
JS自动生成动态HTML验证码页面
2017/06/14 Javascript
JS正则表达式常见函数与用法小结
2020/04/13 Javascript
简单解析Django框架中的表单验证
2015/07/17 Python
[原创]使用豆瓣提供的国内pypi源
2017/07/02 Python
Python实现简单文本字符串处理的方法
2018/01/22 Python
Python读取txt内容写入xls格式excel中的方法
2018/10/11 Python
Python异步操作MySQL示例【使用aiomysql】
2019/05/16 Python
基于Pycharm加载多个项目过程图解
2020/01/19 Python
CSS3中动画属性transform、transition和animation属性的区别
2016/09/25 HTML / CSS
HTML5 Canvas实现文本对齐的方法总结
2016/03/24 HTML / CSS
性能测试工程师的面试题
2015/02/20 面试题
教师敬业奉献模范事迹材料
2014/05/18 职场文书
2014年客服工作总结范文
2014/11/13 职场文书
企业办公室主任岗位职责
2015/04/01 职场文书
烈士陵园观后感
2015/06/08 职场文书
消费者理赔投诉书
2015/07/02 职场文书
母婴行业实体、电商模式全面解析
2019/08/01 职场文书
使用CSS定位HTML元素的实现方法
2022/07/07 HTML / CSS