Javascript获取HTML静态页面参数传递值示例


Posted in Javascript onAugust 18, 2013

给大家看一下我的代码 只要把这些代码嵌入到页面文件即可

例一
利用正则表达式来获取

var LocString = String(window.document.location.href); 
function getQueryStr(str) { 
var rs = new RegExp("(^|)" + str + "=([^&]*)(&|$)", "gi").exec(LocString), tmp; 
if (tmp = rs) { 
return tmp[2]; 
} 
// parameter cannot be found 
return ""; 
}

调用方法
document.getElementById("user").value = getQueryStr("user"); 
document.getElementById("password").value = getQueryStr("password"); 
document.getElementById("sysno").value = getQueryStr("sysno");

例二
利用split函数来按参数切成数组
<script> 
urlinfo=window.location.href; //获取当前页面的url 
len=urlinfo.length;//获取url的长度 
offset=urlinfo.indexOf("?");//设置参数字符串开始的位置 
newsidinfo=urlinfo.substr(offset,len)//取出参数字符串 这里会获得类似“id=1”这样的字符串 
newsids=newsidinfo.split("=");//对获得的参数字符串按照“=”进行分割 
newsid=newsids[1];//得到参数值 
alert("您要传递的参数值是"+newsid); 
</script>

不过一定要记得 这个方法只是针对含有参数的url有用 ,如果对方用了POST方法传递参数, url中是不会含有参数的所以这个技巧只对GET方法或者指定了参数的url有用哦

下面看一个完整的实例

aa.htm是参数输渗入渗出界面
bb.htm是参数接收处理界面
aa.htm

 <html> 
<head> 

</head> 

<body> 

<script> 

function submit() 

{ 

var input1 = document.getElementById("inputid"); 

window.open("bb.htm?inputStr=" + input1.value);//传入参数 

} 

</script> 

<input type = "text" id = "inputid"> 

<input type = "button" onclick = "submit()" value = "提交"> 

</body> 

</html> 

bb.htm: 

<html> 

<head> 

<script> 

//获得参数的方法 

var request = 

{ 

QueryString : function(val) 

{ 

var uri = window.location.search; 

var re = new RegExp("" +val+ "=([^&?]*)", "ig"); 

return ((uri.match(re))?(uri.match(re)[0].substr(val.leng th+1)):null); 

} 

} 

</script> 

</head> 

<body> 

<script> 

//调用方法获得参数 

var rt = request.QueryString("inputStr"); 

alert(rt); 

</script> 

</body> 

</html>

bb.htm
<html> 
<head> 

<title>test</title> 

<meta http-equiv="Content-Type" content="text/html; charset=gb2312"> 

<SCRIPT LANGUAGE="JavaScript"> 

<!-- 

var request = { 

QueryString : function(val) { 

var uri = window.location.search; 

var re = new RegExp("" +val+ "=([^&?]*)", "ig"); 

return ((uri.match(re))?(uri.match(re)[0].substr(val.leng th+1)):null); 

} 

} 

var a = request.QueryString ("a"); 

var b = request.QueryString ("b"); 

var c = request.QueryString ("c"); 

if ((a != null)){a=a} else{a="参数A空"} 

if ((b != null)){b=b} else{b="参数B空"} 

if ((c != null)){c=c} else{c="参数C空"} 

document.writeln("参数A: " + a); 

document.writeln("<br>参数B: " + b); 

document.writeln("<br>参数C: " + c); 

//--> 

</SCRIPT> 

</head> 

<body> 

<form name="form1" action="?"> 

请输入参数值:<br> 

<SCRIPT LANGUAGE="JavaScript"> 

document.writeln("A:<input type='text' name='a' value='"+a+"'><br>"); 

document.writeln("B:<input type='text' name='b' value='"+b+"'><br>"); 

document.writeln("C:<input type='text' name='c' value='"+c+"'><br>"); 

</SCRIPT> 

<input type="submit" name="Submit" value="提交参数查观效果"> 

</form> 

</body> 

</html>
Javascript 相关文章推荐
JAVASCRIPT实现的WEB页面跳转以及页面间传值方法
May 13 Javascript
ajax处理php返回json数据的实例代码
Jan 24 Javascript
jQuery简单实现遍历数组的方法
Apr 14 Javascript
JS模拟按钮点击功能的方法
Dec 22 Javascript
基于JavaScript的操作系统你听说过吗?
Jan 28 Javascript
webpack中引用jquery的简单实现
Jun 08 Javascript
jQuery滚动新闻实现代码
Jun 26 Javascript
基于JS模仿windows文件按名称排序效果
Jun 29 Javascript
seajs学习之模块的依赖加载及模块API的导出
Oct 20 Javascript
玩转NODE.JS(四)-搭建简单的聊天室的代码
Nov 11 Javascript
浅析vue深复制
Jan 29 Javascript
Vue3中的Refs和Ref详情
Nov 11 Vue.js
向左滚动文字 js代码效果
Aug 17 #Javascript
热点新闻滚动特效的js代码
Aug 17 #Javascript
js 获取radio按钮值的实例
Aug 17 #Javascript
js 文本滚动效果的实例代码
Aug 17 #Javascript
javascript用户注册提示效果的简单实例
Aug 17 #Javascript
JS返回上一页实例代码通过图片和按钮分别实现
Aug 16 #Javascript
判断js对象是否拥有某一个属性的js代码
Aug 16 #Javascript
You might like
用文本文件实现的动态实时发布新闻的程序
2006/10/09 PHP
php使用str_replace实现输入框回车替换br的方法
2014/11/24 PHP
php通过array_push()函数添加多个变量到数组末尾的方法
2015/03/18 PHP
php按单词截取字符串的方法
2015/04/07 PHP
php检查是否是ajax请求的方法
2015/04/16 PHP
php获取服务器操作系统相关信息的方法
2016/10/08 PHP
Zend Framework数据库操作方法实例总结
2016/12/11 PHP
jquery zTree异步加载简单实例分享
2013/02/05 Javascript
Google (Local) Search API的简单使用介绍
2013/11/28 Javascript
jQuery 中国省市两级联动选择附图
2014/05/14 Javascript
alert和confirm功能介绍
2014/05/21 Javascript
基于jQuery1.9版本如何判断浏览器版本类型
2016/01/12 Javascript
分享JS数组求和与求最大值的方法
2016/08/11 Javascript
关于动态执行代码(js的Eval)实例详解
2016/08/15 Javascript
详解bootstrap-fileinput文件上传控件的亲身实践
2019/03/21 Javascript
微信小程序学习总结(一)项目创建与目录结构分析
2020/06/04 Javascript
JavaScript大数相加相乘的实现方法实例
2020/10/18 Javascript
如何实现vue的tree组件
2020/12/03 Vue.js
在Python的Django框架中显示对象子集的方法
2015/07/21 Python
Python之——生成动态路由轨迹图的实例
2019/11/22 Python
Python函数参数定义及传递方式解析
2020/06/10 Python
Python+PyQt5+MySQL实现天气管理系统
2020/06/16 Python
python tkinter的消息框模块(messagebox,simpledialog)
2020/11/07 Python
HTML5等待加载动画效果
2017/07/27 HTML / CSS
美国高级音响品牌:Master&Dynamic
2018/07/05 全球购物
应届毕业生应聘自荐信
2013/12/07 职场文书
高一新生军训感言
2014/03/02 职场文书
央视元宵晚会主持串词
2014/03/25 职场文书
应届毕业生自荐书
2014/06/18 职场文书
小学兴趣小组活动总结
2014/07/07 职场文书
国际商务英语专业求职信
2014/07/08 职场文书
党委班子纠正“四风”问题整改措施
2014/10/28 职场文书
留学推荐信(中英文版)
2015/03/26 职场文书
如何使用pdb进行Python调试
2021/06/30 Python
Spring中的使用@Async异步调用方法
2021/11/01 Java/Android
浅谈MySQL中的六种日志
2022/03/23 MySQL