Js+Jq获取URL参数的集中方法示例代码


Posted in Javascript onMay 20, 2014

JQ取值方法:

jquery本身也不存在取得URL参数的方法,但是已经存在插件,可以直接取得URL等参数
插件连接主页:https://github.com/allmarkedup/jQuery-URL-Parser
下载链接:http://download.github.com/allmarkedup-jQuery-URL-Parser-bb2bf37.zip

Examples of use
Using the current page's url (for these examples https://mysite.com/information/about/index.html?itemID=2&user=dave):

// get the protocol
jQuery.url.attr("protocol") // returns 'http'

// get the path
jQuery.url.attr("path") // returns '/information/about/index.html'

// get the host
jQuery.url.attr("host") // returns 'mysite.com'

// get the value for the itemID query parameter
jQuery.url.param("itemID") // returns 2

// get the second segment from the url path
jQuery.url.segment(2) // returns 'about'
Using a different url to the current page:

// set a different URL and return the anchor string
jQuery.url.setUrl("http://allmarkedup.com/category/javascript/#footer").attr("anchor") // returns 'footer'

JS原生获取:

最原始的JS方法:

var URLParams = new Array(); 
var aParams = document.location.search.substr(1).split('&'); 
for (i=0; i < aParams.length ; i++){ 
var aParam = aParams[i].split('='); 
URLParams[aParam[0]] = aParam[1]; 
}

这样调用:

http://127.0.0.1/index.php?name=name1&cid=123
//取得传过来的name参数
name=URLParams["name"];

document.write(name);
//取得传过来的cid

cid=URLParams["cid"];

正则分析法:

方法一:

function getQueryString(name) { 
var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i"); 
var r = window.location.search.substr(1).match(reg); 
if (r != null) return unescape(r[2]); return null; 
}

这样调用:

alert(GetQueryString("参数名1")); alert(GetQueryString("参数名2")); 
alert(GetQueryString("参数名3"));

方法二:
<span style="font-size: 16px;"><Script language="javascript"> 
function GetRequest() { 
var url = location.search; //获取url中"?"符后的字串 
var theRequest = new Object(); 
if (url.indexOf("?") != -1) { 
var str = url.substr(1); 
strs = str.split("&"); 
for(var i = 0; i < strs.length; i ++) { 
theRequest[strs[i].split("=")[0]]=unescape(strs[i].split("=")[1]); 
} 
} 
return theRequest; 
} 
</Script>

这样调用:
<Script language="javascript"> 
var Request = new Object(); 
Request = GetRequest(); 
var 参数1,参数2,参数3,参数N; 
参数1 = Request['参数1']; 
参数2 = Request['参数2']; 
参数3 = Request['参数3']; 
参数N = Request['参数N']; 
</Script>
Javascript 相关文章推荐
JQury slideToggle闪烁问题及解决办法
Jul 05 Javascript
点击弹出层效果&amp;弹出窗口后网页背景变暗效果的实现代码
Feb 10 Javascript
移动设备web开发首选框架:zeptojs介绍
Jan 29 Javascript
JavaScript数据操作_浅谈原始值和引用值的操作本质
Aug 23 Javascript
浅析ES6的八进制与二进制整数字面量
Aug 30 Javascript
jquery.validate表单验证插件使用方法解析
Nov 07 Javascript
jQuery插件ajaxFileUpload使用详解
Jan 10 Javascript
浅谈在fetch方法中添加header后遇到的预检请求问题
Aug 31 Javascript
详解基于vue-router的动态权限控制实现方案
Sep 28 Javascript
vue项目打包后打开页面空白解决办法
Jun 29 Javascript
Bootstrap的aria-label和aria-labelledby属性实例详解
Nov 02 Javascript
微信小程序websocket聊天室的实现示例代码
Feb 12 Javascript
js 采用delete实现继承示例代码
May 20 #Javascript
js清空form表单中的内容示例
May 20 #Javascript
Javascript 函数parseInt()转换时出现bug问题
May 20 #Javascript
JavaScript中this关键词的使用技巧、工作原理以及注意事项
May 20 #Javascript
Jquery插件分享之气泡形提示控件grumble.js
May 20 #Javascript
实现网页页面跳转的几种方法(meta标签、js实现、php实现)
May 20 #Javascript
jQuery.holdReady()使用方法
May 20 #Javascript
You might like
PHP读取目录下所有文件的代码
2008/01/07 PHP
php中使用接口实现工厂设计模式的代码
2012/06/17 PHP
php读取大文件示例分享(文件操作类)
2014/04/13 PHP
php文件缓存类汇总
2014/11/21 PHP
thinkPHP5分页功能实现方法分析
2017/10/25 PHP
php微信公众号开发之快递查询
2018/10/20 PHP
关于图片按比例自适应缩放的js代码
2011/10/30 Javascript
js调试系列 断点与动态调试[基础篇]
2014/06/18 Javascript
使用不同的方法结合/合并两个JS数组
2014/09/18 Javascript
上传图片预览JS脚本 Input file图片预览的实现示例
2014/10/23 Javascript
javascript中tostring()和valueof()的用法及两者的区别
2015/11/16 Javascript
jQuery+css实现非常漂亮的水平导航菜单效果
2016/07/27 Javascript
小程序实现页面顶部选项卡效果
2018/11/06 Javascript
VUE table表格动态添加一列数据,新增的这些数据不可以编辑(v-model绑定的数据不能实时更新)
2020/04/03 Javascript
在Vue 中实现循环渲染多个相同echarts图表
2020/07/20 Javascript
python获得图片base64编码示例
2014/01/16 Python
Python文件夹与文件的操作实现代码
2014/07/13 Python
Python获取央视节目单的实现代码
2015/07/25 Python
python3 拼接字符串的7种方法
2018/09/12 Python
Python数据可视化:顶级绘图库plotly详解
2019/12/07 Python
Python pandas如何向excel添加数据
2020/05/22 Python
常用的10个Python实用小技巧
2020/08/10 Python
CSS超出文本指定宽度用省略号代替和文本不换行
2016/05/05 HTML / CSS
Discard Protocol抛弃协议的作用是什么
2015/10/10 面试题
社会实践自我鉴定
2013/11/07 职场文书
业绩考核岗位职责
2014/02/01 职场文书
小学信息技术教学反思
2014/02/10 职场文书
大宝sod蜜广告词
2014/03/21 职场文书
《大禹治水》教学反思
2014/04/27 职场文书
汽车销售经理岗位职责
2014/06/09 职场文书
爱护公物标语
2014/06/24 职场文书
2014机关干部学习“焦裕禄精神”思想汇报
2014/09/19 职场文书
2015年三好一满意工作总结
2015/07/24 职场文书
2016拓展训练心得体会范文
2016/01/12 职场文书
小学语文教学反思范文
2016/03/03 职场文书
原生JS实现分页
2022/04/19 Javascript