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 相关文章推荐
Javascript注入技巧
Jun 22 Javascript
JavaScript 对任意元素,自定义右键菜单的实现方法
May 08 Javascript
jquery 页眉单行信息滚动显示实现思路及代码
Jun 26 Javascript
AngularJS入门教程(零):引导程序
Dec 06 Javascript
浅析C/C++,Java,PHP,JavaScript,Json数组、对象赋值时最后一个元素后面是否可以带逗号
Mar 22 Javascript
ajax图片上传,图片异步上传,更新实例
Dec 30 Javascript
javascript九宫格图片随机打乱位置的实现方法
Mar 15 Javascript
JS实现的透明度渐变动画效果示例
Apr 28 Javascript
vue项目刷新当前页面的三种方法
Dec 04 Javascript
iview实现图片上传功能
Jun 29 Javascript
Jquery $.map使用方法实例详解
Sep 01 jQuery
threejs太阳光与阴影效果实例代码
Apr 05 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 自写函数代码 获取关键字 去超链接
2010/02/08 PHP
php+mysql删除指定编号员工信息的方法
2015/01/14 PHP
PHP简单选择排序算法实例
2015/01/26 PHP
PHP数据对象PDO操作技巧小结
2016/09/27 PHP
Add a Formatted Table to a Word Document
2007/06/15 Javascript
jQuery EasyUI中对表格进行编辑的实现代码
2010/06/10 Javascript
jquery实现控制表格行高亮实例
2013/06/05 Javascript
在javaScript中关于submit和button的区别介绍
2013/10/20 Javascript
js opener的使用详解
2014/01/11 Javascript
原生js结合html5制作小飞龙的简易跳球
2015/03/30 Javascript
Javascript中的迭代、归并方法详解
2016/06/14 Javascript
javascript实现滚动效果的数字时钟实例
2016/07/21 Javascript
原生js仿淘宝网商品放大镜效果
2017/02/28 Javascript
整理一些最近经常遇到的前端面试题
2017/04/25 Javascript
vue 怎么创建组件及组件使用方法
2017/07/27 Javascript
浅谈Angular路由守卫
2017/08/26 Javascript
angular基于ng-alain定义自己的select组件示例
2018/02/23 Javascript
JS实现的RC4加密算法示例
2018/08/16 Javascript
在小程序中使用canvas的方法示例
2018/09/17 Javascript
详解如何使用node.js的开发框架express创建一个web应用
2018/12/20 Javascript
angularjs http与后台交互的实现示例
2018/12/21 Javascript
重学 JS:为啥 await 不能用在 forEach 中详解
2019/04/15 Javascript
基于vue-cli、elementUI的Vue超简单入门小例子(推荐)
2019/04/17 Javascript
JS/jQuery实现超简单的Table表格添加,删除行功能示例
2019/07/31 jQuery
微信小程序点击保存图片到本机功能
2019/12/13 Javascript
opencv实现静态手势识别 opencv实现剪刀石头布游戏
2019/01/22 Python
python将数组n等分的实例
2019/12/02 Python
python实现logistic分类算法代码
2020/02/28 Python
深入解读CSS3中transform变换模型的渲染
2016/05/27 HTML / CSS
Html5之自定义属性(data-,dataset)
2019/11/19 HTML / CSS
Burberry英国官网:英国标志性奢侈品牌
2017/03/29 全球购物
C#笔试题集合
2013/06/21 面试题
人事文员岗位职责
2014/02/16 职场文书
学校四风对照检查材料
2014/08/28 职场文书
2015年学校团委工作总结
2015/05/26 职场文书
利用Java连接Hadoop进行编程
2022/06/28 Java/Android