静态页面html中跳转传值的JS处理技巧


Posted in Javascript onJune 22, 2016

本文实例讲述了静态页面html中跳转传值的JS处理技巧。分享给大家供大家参考,具体如下:

在html中通过"?"传值:

<a href="index2.html?name=caoy">静态传值</a>

在跳转到的页面index2.html中接收:

var name=UrlParm.parm("name");

代码如下:

index.html:

<script type="text/javascript" src="getUrlParam.js"></script>
<a href="index2.html?name=caoy">静态传值</a>

index2.html:

<script type="text/javascript">
  var name=UrlParm.parm("name");
  alert(name);
</script>

getUrlParam.js:

UrlParm = function() { // url参数
 var data, index;
 (function init() {
  data = [];
  index = {};
  var u = window.location.search.substr(1);
  if (u != '') {
   var parms = decodeURIComponent(u).split('&');
   for (var i = 0, len = parms.length; i < len; i++) {
    if (parms[i] != '') {
     var p = parms[i].split("=");
     if (p.length == 1 || (p.length == 2 && p[1] == '')) {// p | p=
      data.push(['']);
      index[p[0]] = data.length - 1;
     } else if (typeof(p[0]) == 'undefined' || p[0] == '') { // =c | =
      data[0] = [p[1]];
     } else if (typeof(index[p[0]]) == 'undefined') { // c=aaa
      data.push([p[1]]);
      index[p[0]] = data.length - 1;
     } else {// c=aaa
      data[index[p[0]]].push(p[1]);
     }
    }
   }
  }
 })();
 return {
  // 获得参数,类似request.getParameter()
  parm : function(o) { // o: 参数名或者参数次序
   try {
    return (typeof(o) == 'number' ? data[o][0] : data[index[o]][0]);
   } catch (e) {
   }
  },
  //获得参数组, 类似request.getParameterValues()
  parmValues : function(o) { // o: 参数名或者参数次序
   try {
    return (typeof(o) == 'number' ? data[o] : data[index[o]]);
   } catch (e) {}
  },
  //是否含有parmName参数
  hasParm : function(parmName) {
   return typeof(parmName) == 'string' ? typeof(index[parmName]) != 'undefined' : false;
  },
  // 获得参数Map ,类似request.getParameterMap()
  parmMap : function() {
   var map = {};
   try {
    for (var p in index) { map[p] = data[index[p]]; }
   } catch (e) {}
   return map;
  }
 }
}();

这样就能通过html跳转传值了

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
两个比较有用的Javascript工具函数代码
Feb 17 Javascript
JavaScript onkeypress事件入门实例(按下或按住一个键盘按键)
Oct 17 Javascript
JS实现模拟风力的雪花飘落效果
May 13 Javascript
jQuery实现灰蓝风格标准二级下拉菜单效果代码
Aug 31 Javascript
JS操作COOKIE实现备忘记录的方法
Apr 01 Javascript
KnockoutJS 3.X API 第四章之数据控制流component绑定
Oct 10 Javascript
vue按需引入element Transfer 穿梭框
Sep 30 Javascript
对vue 键盘回车事件的实例讲解
Aug 25 Javascript
JavaScript实现小球沿正弦曲线运动
Sep 07 Javascript
ES6小技巧之代替lodash
Jun 07 Javascript
vant中的toast层级改变操作
Nov 04 Javascript
一篇文章看懂JavaScript中的回调
Jan 05 Javascript
浅谈JavaScript for循环 闭包
Jun 22 #Javascript
Javascript获取随机数的实现方法
Jun 22 #Javascript
解析浏览器端的AJAX缓存机制
Jun 21 #Javascript
JS实现对中文字符串进行utf-8的Base64编码的方法(使其与Java编码相同)
Jun 21 #Javascript
第十篇BootStrap轮播插件使用详解
Jun 21 #Javascript
JavaScript简单获取页面图片原始尺寸的方法
Jun 21 #Javascript
第九篇Bootstrap导航菜单创建步骤详解
Jun 21 #Javascript
You might like
php数据类型判断函数有哪些
2013/09/23 PHP
PHP实现限制IP访问及提交次数的方法详解
2017/07/17 PHP
PHP文件类型检查及fileinfo模块安装使用详解
2019/05/09 PHP
javascript 进度条 实现代码
2009/07/30 Javascript
js获取图片长和宽度的代码
2009/11/24 Javascript
jquery 弹出登录窗口实现代码
2009/12/24 Javascript
jQuery的实现原理的模拟代码 -3 事件处理
2010/08/03 Javascript
基于jQuery+HttpHandler实现图片裁剪效果代码(适用于论坛, SNS)
2011/09/02 Javascript
兼容IE和FF的图片上传前预览js代码
2013/05/28 Javascript
js计算字符串长度包含的中文是utf8格式
2013/10/15 Javascript
基于jQuery实现复选框的全选 全不选 反选功能
2014/11/24 Javascript
详解JavaScript中Date.UTC()方法的使用
2015/06/12 Javascript
jquery+php随机生成红包金额数量代码分享
2015/08/27 Javascript
ionic中列表项增加和删除的实现方法
2017/01/22 Javascript
jQuery实现可兼容IE6的遮罩功能详解
2017/09/19 jQuery
three.js中文文档学习之如何本地运行详解
2017/11/20 Javascript
详解vue表单——小白速看
2018/04/08 Javascript
JavaScript基础之静态方法和实例方法分析
2018/12/26 Javascript
小程序云开发获取不到数据库记录的解决方法
2019/05/18 Javascript
微信小程序中weui用法解析
2019/10/21 Javascript
vscode+gulp轻松开发小程序的完整步骤
2020/10/18 Javascript
[46:47]完美世界DOTA2联赛PWL S2 FTD vs Magma 第二场 11.20
2020/11/23 DOTA
python通过exifread模块获得图片exif信息的方法
2015/03/16 Python
python3 读取Excel表格中的数据
2018/10/16 Python
Python 文件数据读写的具体实现
2020/01/24 Python
使用Tkinter制作信息提示框
2020/02/18 Python
pandas map(),apply(),applymap()区别解析
2021/02/24 Python
世界顶级俱乐部的官方球衣和套装:Subside Sports
2018/04/22 全球购物
古驰英国官网:GUCCI英国
2020/03/07 全球购物
Currentbody德国站:健康与美容技术专家
2020/04/05 全球购物
请介绍一下WSDL的文档结构
2013/03/17 面试题
大学生职业生涯规划范文
2014/01/08 职场文书
另类冲刺标语
2014/06/24 职场文书
2015年房产经纪人工作总结
2015/05/15 职场文书
nginx反向代理时如何保持长连接
2021/03/31 Servers
Python使用openpyxl批量处理数据
2021/06/23 Python