js_参数的get传输，从一个页面到另外一个页面。
2017年10月31日，今天是万圣节，欢乐谷搞事情。
刚接触前端那会是分不清，前端和后台的，后台的数据如何传输到前端的。
现在用的还是Jquery的ajax请求后台数据到前端页面的，需要学习的地方还有很多，任重而道远也。
前后端分离，你是如何定义的呢？我现在公司现在用的php后台语言，现在逐步转型到Java，在此记录一点点变化，用作后面追忆
岁月的时候，可以作为回忆的印记。
技术：
<!DOCTYPE html>
<html> <head>
<meta charset="UTF-8">
<title></title>
</head> <body>
<p>如果你浏览器的URL是：http://127.0.0.1:8020/web-demo/demodemo/data02.html?id=88&topId=66&artId=6868&findId=999</p>
</body>
<script type="text/javascript">
//1.通过下面封装对方法，查询对应对参数
var id = getQueryString("id");
var topId = getQueryString("topId");
var artId = getQueryString("artId");
var findId = getQueryString("findId");
//2.封装的一个函数对URL后面的参数进行查询，可以直接复制在项目中使用
function getQueryString(name) {
var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
var r = window.location.search.substr(1).match(reg);
if(r != null) return unescape(r[2]);
return '';
};
//3.在控制台打印对应对参数
console.log(id); //
console.log(topId); //
console.log(artId); //
console.log(findId); //
</script> </html>
我们从一个页面到另外一个页面的时候，有时候需要带一个参数过去，加以区分，这个时候就需要用到URL后面把参数带过去。
http://127.0.0.1:8020/web-demo/demodemo/data02.html?id=88&topId=66&artId=6868&findId=999
例如上面这个链接，我们只需要在链接最后通过?xxx=&xxx=&xxx=这样的方式把参数通过URL传递到另外一个页面，注意?xxx=只能只能出现一次，后面的参数我们通过&xxx=传递；
其中xxx为你传递的参数。
参数带过去，我们可以通过下面的函数把它提取出来：
function getQueryString(name) {
var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
var r = window.location.search.substr(1).match(reg);
if(r != null) return unescape(r[2]);
return '';
};
上面这个方法只能提前数字和字母，不能提起中文。在后续传递中文的过程中，无法把参数给提取出来。经过研究，可以使用另外一种方法，既可以提取中文也可以提取英文。
getQueryStringZH: function() {
var url = window.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]] = decodeURI(strs[i].split("=")[1]);
//之前用了unescape()
//才会出现乱码
}
}
return theRequest;
},
注意你提起出来的是一个对象，需要通过提起对象的参数而获得参数。
var getRequest = common.getQueryStringZH();
var companyName = getRequest.companyName;
然后你就可以在文档中，随意使用了。
js_参数的get传输，从一个页面到另外一个页面。的更多相关文章
- 从上一个页面跳入新页面时，如何拿URL中的参数
var url = document.URL; //获取当前页面的url var urlA = url.split('?');//以url中的问号进行分割; var goodscode = urlA[ ...
- 学习ASP.NET MVC(七)——我的第一个ASP.NET MVC 查询页面
在本篇文章中,我将添加一个新的查询页面(SearchIndex),可以按书籍的种类或名称来进行查询.这个新页面的网址是http://localhost:36878/Book/ SearchIndex. ...
- 分享如何使用PHP将URL地址参数进行加密传输提高网站安全性
大家在使用PHP进行GET或POST提交数据时,经常会在URL带着参数进行传递,比如www.mdaima.com/get.php?id=1&page=5,这里就将id编号和page页码进行了参 ...
- android一个app打开另一个app的指定页面
一个app打开另一个app的指定页面方法 有以下几种 1.通过包名.类名 2.通过intent的 action 3.通过Url 方案1. ComponentName componentName = n ...
- 一个jsp页面引入另一个jsp页面的三种方式 及静态引入和动态引入的区别
转载下, 转载自:http://blog.csdn.net/fn_2015/article/details/70311495 1.第一种:jstl import <c:import url=& ...
- vue:解决使用param传参后，再次刷新页面会新增一个原有的tab
问题:在最近的项目中,我通过传递不同的参数,复用同一组件进行渲染,然而意外出现一个bug,就是当我重新刷新该页面时,会新增一个tab 原来的: 刷新页面后: 查阅资料后,发现该现象是由于通过param ...
- [从 0 开始的 Angular 生活]No.38 实现一个 Angular Router 切换组件页面(一)
前言 今天是进入公司的第三天,为了能尽快投入项目与成为团队可用的战力,我正在努力啃官方文档学习 Angular 的知识,所以这一篇文章主要是记录我如何阅读官方文档后,实现这个非常基本的.带导航的网页应 ...
- Flutter学习六之实现一个带筛选的列表页面
上期实现了一个网络轮播图的效果,自定义了一个轮播图组件,继承自StatefulWidget,我们知道Flutter中并没有像Android中activity的概念.页面见的跳转是通过路由从一个全屏组件 ...
- C# 复制PDF页面到另一个PDF文档
C# 复制PDF页面到另一个PDF文档 有时候我们可能有这样一个需求,那就是把PDF页面从一个PDF文档复制到另一个PDF文档中.由于PDF文档并不像word文档那样好编辑,因此复制也相对没有那么容易 ...
随机推荐
- ios::sync_with_stdio(false)提高C++读写速度
版权声明:若无来源注明,Techie亮博客文章均为原创. 转载请以链接形式标明本文标题和地址: 本文标题:ios::sync_with_stdio(false)提高C++读写速度 本文地址:h ...
- js图片转换为base64
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- 【linux】- nohup 和 &
&的意思是在后台运行, 什么意思呢? 意思是说,当你在执行 ./a.out & 的时候,即使你用ctrl C,那么a.out照样运行(因为对SIGINT信号免疫).但是要注意,如果你直 ...
- FineCMS介绍
产品简介 FineCMS(简称免费版.企业版.公益版)是一款基于PHP+MySql+CI框架开发的高效简洁的中小型内容管理系统,面向多终端包括Pc端网页和移动端网页,支持自定义内容模型和会员模型, ...
- 统计VS2013中有效行数
将鼠标放在解决方案处,按下ctrl+shift+F b*[^:b#/]+.*$(带前面的using)^b*[^:b#/]+.*$
- xpath获取块元素下<br>下的信息
再爬虫取字段的时候遇到一种类似下面的结构: <p> <br> "通用名称:xxxxxx" </p> 用xpath取的方式://p//text() ...
- Delphi DBGrid双击事件、单元格操作
1.得到当前格子中的内容:DBGrid1.Fields[DBGrid1.SelectedIndex].DisplayText;把DBGrid1.SelectedIndex改为你所希望引用的字段就可以了 ...
- 【数据库】各种主流 SQLServer 迁移到 MySQL 工具对比
在部署前期,首要任务就是考虑如何快速把基于 SQL Server 数据库的应用程序移植到阿里云的 MySQL 数据库.由于程序是基于 O/R mapping 编写,并且数据库中没有使用存储过程.用户函 ...
- BZOJ 1022 小约翰的游戏(anti-sg)
这是个anti-sg问题,套用sj定理即可解. SJ定理 对于任意一个Anti-SG游戏,如果定义所有子游戏的SG值为0时游戏结束,先手必胜的条件: 1.游戏的SG值为0且所有子游戏SG值均不超过1. ...
- linux 服务器丢包故障排查
项目开了个P2P服务器,但是运行一段时间就会出现丢包问题,具体表现为:1.udp丢包严重(一分钟收发分别1.5W) 2.ssh(用于运维指令)连接不上该服务器(超时) 3.服务器运行好像没什么异常,u ...