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 相关文章推荐
jquery实现excel导出的方法
Apr 04 Javascript
利用毫秒减值计算时长的js代码
Sep 22 Javascript
基于jquery实现的省市区级联无ajax
Sep 24 Javascript
jquery中checkbox全选失效的解决方法
Dec 26 Javascript
jQuery中slideUp 和 slideDown 的点击事件
Feb 26 Javascript
js实现二级菜单渐隐显示
Nov 03 Javascript
jQuery插件HighCharts实现的2D面积图效果示例【附demo源码下载】
Mar 15 Javascript
利用angular、react和vue实现相同的面试题组件
Feb 19 Javascript
使用jquery模拟a标签的click事件无法实现跳转的解决
Dec 04 jQuery
微信小程序在线客服自动回复功能(基于node)
Jul 03 Javascript
JS回调函数 callback的理解与使用案例分析
Sep 09 Javascript
vue实现一个矩形标记区域(rectangle marker)的方法
Oct 28 Javascript
向左滚动文字 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
Laravel框架数据库CURD操作、连贯操作总结
2014/09/03 PHP
服务器上配置PHP运行环境教程
2015/02/12 PHP
使用PHP如何实现高效安全的ftp服务器(一)
2015/12/20 PHP
php实现往pdf中加数字签名操作示例【附源码下载】
2018/08/07 PHP
php设计模式之迭代器模式实例分析【星际争霸游戏案例】
2020/04/07 PHP
初试jQuery EasyUI 使用介绍
2010/04/01 Javascript
基于jquery的给文章加入关键字链接
2010/10/26 Javascript
jquery.validate使用时遇到的问题
2015/05/25 Javascript
牛叉的Jquery——Jquery与DOM对象的互相转换及DOM的三种操作
2015/10/29 Javascript
获取JavaScript异步函数的返回值
2016/12/21 Javascript
详解使用angularjs的ng-options时如何设置默认值(初始值)
2017/07/18 Javascript
JS实现评价的星星功能
2017/08/20 Javascript
微信小程序中button组件的边框设置的实例详解
2017/09/27 Javascript
JS实现元素上下左右移动效果
2017/10/18 Javascript
3种vue组件的书写形式
2017/11/29 Javascript
js canvas实现二维码和图片合成的海报
2020/11/19 Javascript
使用Karma做vue组件单元测试的实现
2020/01/16 Javascript
vue项目中使用vue-layer弹框插件的方法
2020/03/11 Javascript
Openlayers测量距离与面积的实现方法
2020/09/25 Javascript
jquery实现淡入淡出轮播图效果
2020/12/13 jQuery
vue3.0中友好使用antdv示例详解
2021/01/05 Vue.js
Python的SQLAlchemy框架使用入门
2015/04/29 Python
详解Python中find()方法的使用
2015/05/18 Python
PYTHON发送邮件YAGMAIL的简单实现解析
2019/10/28 Python
PyQT5 emit 和 connect的用法详解
2019/12/13 Python
解决Python 写文件报错TypeError的问题
2020/10/23 Python
HTML5 Canvas实现平移/放缩/旋转deom示例(附截图)
2013/07/04 HTML / CSS
html5使用canvas绘制太阳系效果
2014/12/15 HTML / CSS
前端实现打印图像功能
2019/08/27 HTML / CSS
转预备党员政审材料
2014/02/06 职场文书
党员承诺书范文
2014/05/19 职场文书
暑期政治学习心得体会
2014/09/02 职场文书
教育项目合作协议书格式
2014/10/17 职场文书
2015年教研室工作总结范文
2015/05/23 职场文书
2020年基层司法所建设情况调研报告
2019/11/30 职场文书
nginx限制并发连接请求数的方法
2021/04/01 Servers