javascript实现html页面之间参数传递的四种方法实例分析


Posted in Javascript onDecember 15, 2015

本文实例讲述了javascript实现html页面之间参数传递的四种方法。分享给大家供大家参考,具体如下:

我们知道,在服务器端asp,jsp等程序可以接受html页面上的form传来的参数。那么,可不可以传递参数给html页面呢。可以。
原理:通过window.location.href中的分割符获得各个参数

方法一:

/*
 *函数功能:从href获得参数
 *sHref: http://www.cscenter.com.cn/arg.htm?arg1=d&arg2=re
 *sArgName:arg1, arg2
 *return: the value of arg. d, re
 */
function GetArgsFromHref(sHref, sArgName)
{
 var args = sHref.split("?");
 var retval = "";
 if(args[0] == sHref) /*参数为空*/
 {
   return retval; /*无需做任何处理*/
 } 
 var str = args[1];
 args = str.split("&");
 for(var i = 0; i < args.length; i ++)
 {
  str = args[i];
  var arg = str.split("=");
  if(arg.length <= 1) continue;
  if(arg[0] == sArgName) retval = arg[1];
 }
 return retval;
}

方法二:

function getvalue(name)
{
var str=window.location.search;
if (str.indexOf(name)!=-1)
{
var pos_start=str.indexOf(name)+name.length+1;
var pos_end=str.indexOf("&",pos_start);
if (pos_end==-1)
{
return str.substring(pos_start);
}
else
{
return str.substring(pos_start,pos_end)
}
}
else
{
return "没有这个name值";
}
}
alert(getvalue(name));

方法三:

Request = {
QueryString : function(item){
var svalue = location.search.match(new RegExp("[\?\&]" + item + "=([^\&]*)(\&?)","i"));
return svalue ? svalue[1] : svalue;
}
}
alert(Request.QueryString("id"));

方法四:

var url=location.search;
var Request = new Object();
if(url.indexOf("?")!=-1)
{
 var str = url.substr(1); //去掉?号
 strs = str.toLowerCase();
 strs = strs.split("&");
 for(var i=0;i<strs.length;i++)
 {
  Request[strs[i].split("=")[0]]=unescape(strs[i].split("=")[1]);
 }
}
var mapWidth = Request["w"];
var mapHeight = Request["h"];

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

Javascript 相关文章推荐
一个高效的JavaScript压缩工具下载集合
Mar 06 Javascript
js 面向对象的技术创建高级 Web 应用程序
Feb 25 Javascript
jQuery筛选器children()案例详解(图文)
Feb 17 Javascript
Javascript中innerHTML用法实例分析
Jan 12 Javascript
javascript实现显示和隐藏div方法汇总
Aug 14 Javascript
JavaScript常用代码书写规范的超全面总结
Sep 11 Javascript
js 动态生成html 触发事件传参字符转义的实例
Feb 14 Javascript
vue移动端UI框架实现QQ侧边菜单组件
Mar 09 Javascript
layui实现三级联动效果
Jul 26 Javascript
JavaScript进制转换实现方法解析
Jan 18 Javascript
解决Vue中使用keepAlive不缓存问题
Aug 04 Javascript
vue+elementui通用弹窗的实现(新增+编辑)
Jan 07 Vue.js
js编写贪吃蛇的小游戏
Aug 24 #Javascript
javascript实现网页端解压并查看zip文件
Dec 15 #Javascript
探究JavaScript函数式编程的乐趣
Dec 14 #Javascript
jQuery+json实现的简易Ajax调用实例
Dec 14 #Javascript
以JavaScript来实现WordPress中的二级导航菜单的方法
Dec 14 #Javascript
JS实现DIV容器赋值的方法
Dec 14 #Javascript
JavaScript中eval()函数用法详解
Dec 14 #Javascript
You might like
php和js如何通过json互相传递数据相关问题探讨
2013/02/26 PHP
Linux下PHP安装mcrypt扩展模块笔记
2014/09/10 PHP
thinkPHP中分页用法实例分析
2015/12/26 PHP
JavaScript实现删除电脑的关机键
2016/07/26 PHP
实例讲解YII2中多表关联的使用方法
2017/07/21 PHP
JavaScript 中的replace方法说明
2007/04/13 Javascript
js判断背景图片是否加载成功使用img的width实现
2013/05/29 Javascript
jQuery之排序组件的深入解析
2013/06/19 Javascript
js取两个数组的交集|差集|并集|补集|去重示例代码
2013/08/07 Javascript
js操作模态窗口及父子窗口间相互传值示例
2014/06/09 Javascript
javascript实现画不相交的圆
2015/04/07 Javascript
Ajax验证用户名或昵称是否已被注册
2017/04/05 Javascript
深入理解vue中的$set
2017/06/01 Javascript
详解vue项目构建与实战
2017/06/27 Javascript
Javascript(es2016) import和require用法和区别详解
2017/08/11 Javascript
微信小程序实现给嵌套template模板传递数据的方式总结
2017/12/18 Javascript
Javascript实现动态时钟效果
2018/11/17 Javascript
详解@Vue/Cli 3 Invalid Host header 错误解决办法
2019/01/02 Javascript
vue 项目接口管理的实现
2019/01/17 Javascript
Vue实现点击导航栏当前标签后变色功能
2020/08/19 Javascript
使用Vue实现一个树组件的示例
2020/11/06 Javascript
详解pandas安装若干异常及解决方案总结
2019/01/10 Python
python NumPy ndarray二维数组 按照行列求平均实例
2019/11/26 Python
python时间日期操作方法实例小结
2020/02/06 Python
python+django+selenium搭建简易自动化测试
2020/08/19 Python
荷兰音乐会和音乐剧门票订购网站:Topticketshop
2019/08/27 全球购物
C++:memset ,memcpy和strcpy的根本区别
2013/04/27 面试题
多媒体编辑专业毕业生推荐信
2013/11/05 职场文书
毕业生求职找工作的自我评价范文
2013/11/27 职场文书
感恩节红领巾广播稿
2014/02/11 职场文书
党员十八大心得体会
2014/09/12 职场文书
积极心理学课程心得体会
2016/01/22 职场文书
创业计划书之酒厂
2019/10/14 职场文书
教你怎么用python爬取爱奇艺热门电影
2021/05/20 Python
MySQL 分区表中分区键为什么必须是主键的一部分
2022/03/17 MySQL
彩虹社八名人气艺人全新周边限时推出,性转女装男装一次拥有!
2022/04/01 日漫