静态页面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 相关文章推荐
js中的值类型和引用类型小结 文字说明与实例
Dec 12 Javascript
js仿土豆网带缩略图的焦点图片切换效果实现方法
Feb 23 Javascript
EasyUI中实现form表单提交的示例分享
Mar 01 Javascript
Bootstrap3学习笔记(二)之排版
May 20 Javascript
Bootstrap栅格系统的使用和理解2
Dec 14 Javascript
javascript 中null和undefined区分和比较
Apr 19 Javascript
详解angularJS动态生成的页面中ng-click无效解决办法
Jun 19 Javascript
利用jQuery实现简单的拖曳效果实例代码
Oct 20 jQuery
JS设计模式之策略模式概念与用法分析
Feb 05 Javascript
使用javascript函数编写简单银行取钱存钱流程
May 26 Javascript
详解Vue改变数组中对象的属性不重新渲染View的解决方案
Sep 21 Javascript
用webpack4开发小程序的实现方法
Jun 04 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 for 循环语句使用方法详细说明
2010/05/09 PHP
回帖脱衣服的图片实现代码
2014/02/15 PHP
php变量与数组相互转换的方法(extract与compact)
2016/12/02 PHP
laravel利用中间件防止未登录用户直接访问后台的方法
2019/09/30 PHP
javascript读取RSS数据
2007/01/20 Javascript
jQuery UI-Draggable 参数集合
2010/01/10 Javascript
ImageZoom 图片放大镜效果(多功能扩展篇)
2010/04/14 Javascript
js二维数组定义和初始化的三种方法总结
2014/03/03 Javascript
JavaScript中最简洁的编码html字符串的方法
2014/10/11 Javascript
JS延时提示框实现方法详解
2015/11/26 Javascript
js实现图片轮播效果
2015/12/19 Javascript
JS如何判断json是否为空
2016/07/06 Javascript
angular源码学习第一篇 setupModuleLoader方法
2016/10/20 Javascript
NodeJS实现图片上传代码(Express)
2017/06/30 NodeJs
nodejs结合socket.io实现websocket通信功能的方法
2018/01/12 NodeJs
微信小程序实现展示评分结果功能
2019/02/15 Javascript
NodeJs入门教程之定时器和队列
2019/03/08 NodeJs
微信小程序生成分享海报方法(附带二维码生成)
2019/03/29 Javascript
详解Vue路由自动注入实践
2019/04/17 Javascript
vuex 中插件的编写案例解析
2019/06/10 Javascript
详解JavaScript 浮点数运算的精度问题
2019/07/23 Javascript
基于Nuxt.js项目的服务端性能优化与错误检测(容错处理)
2019/10/23 Javascript
微信小程序picker组件两列关联使用方式
2020/10/27 Javascript
python抓取网页内容示例分享
2014/02/24 Python
python实现批量改文件名称的方法
2015/05/25 Python
浅谈python中np.array的shape( ,)与( ,1)的区别
2018/06/04 Python
Python中有几个关键字
2020/06/04 Python
通过Python pyecharts输出保存图片代码实例
2020/11/25 Python
css3 伪类选择器快速复习小结
2019/09/10 HTML / CSS
用HTML5 Canvas API中的clearRect()方法实现橡皮擦功能
2016/03/15 HTML / CSS
在线学习西班牙语、法语或其他语言:Babbel.com
2018/02/07 全球购物
澳大利亚天然护肤品、化妆品和健康产品一站式商店:Nourished Life
2018/12/02 全球购物
关于礼仪的演讲稿
2014/01/04 职场文书
小学教师自我鉴定范文
2014/03/20 职场文书
PyTorch 实现L2正则化以及Dropout的操作
2021/05/27 Python
Java面试题冲刺第十七天--基础篇3
2021/08/07 面试题