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 相关文章推荐
js 字符串转换成数字的三种方法
Mar 23 Javascript
用原生JavaScript实现jQuery的$.getJSON的解决方法
May 03 Javascript
JS JSON对象转为字符串的简单实现方法
Nov 18 Javascript
Javascript常用字符串判断函数代码分享
Dec 08 Javascript
javascript基本算法汇总
Mar 09 Javascript
深入理解bootstrap框架之入门准备
Oct 09 Javascript
探讨AngularJs中ui.route的简单应用
Nov 16 Javascript
JS 循环li添加点击事件 (闭包的应用)
Dec 10 Javascript
关于vue.js组件数据流的问题
Jul 26 Javascript
vue脚手架及vue-router基本使用
Apr 09 Javascript
Vue双向数据绑定(MVVM)的原理
Oct 03 Javascript
uni-app 自定义底部导航栏的实现
Dec 11 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中常用的输出函数总结
2014/09/22 PHP
浅析Yii2 GridView 日期格式化并实现日期可搜索教程
2016/04/22 PHP
php unicode编码和字符串互转的方法
2020/08/12 PHP
用js判断页面刷新或关闭的方法(onbeforeunload与onunload事件)
2012/06/22 Javascript
JS Replace()的高级使用方法介绍
2013/06/29 Javascript
Jquery Ajax解析XML数据(同步及异步调用)简单实例
2014/02/12 Javascript
javascript原型链继承用法实例分析
2015/01/28 Javascript
Javascript核心读书有感之表达式和运算符
2015/02/11 Javascript
jquery判断密码强度的验证代码
2020/04/22 Javascript
AngularJS控制器controller给模型数据赋初始值的方法
2017/01/04 Javascript
微信小程序 网络请求(post请求,get请求)
2017/01/17 Javascript
CodeMirror js代码加亮使用总结
2017/03/25 Javascript
Node学习记录之cluster模块
2017/05/31 Javascript
给vue项目添加ESLint的详细步骤
2017/09/29 Javascript
node thread.sleep实现示例
2018/06/20 Javascript
Vue实现用户自定义字段显示数据的方法
2018/08/28 Javascript
浅谈vue项目用到的mock数据接口的两种方式
2019/10/09 Javascript
js与jquery获取input输入框中的值实例讲解
2020/02/27 jQuery
详细分析React 表单与事件
2020/07/08 Javascript
Vue实现点击导航栏当前标签后变色功能
2020/08/19 Javascript
解决ant design vue 表格a-table二次封装,slots渲染的问题
2020/10/28 Javascript
javascript实现移动端轮播图
2020/12/09 Javascript
Python注释、分支结构、循环结构、伪“选择结构”用法实例分析
2020/01/09 Python
Python dict的常用方法示例代码
2020/06/23 Python
python报错: 'list' object has no attribute 'shape'的解决
2020/07/15 Python
Ben Sherman官方网站:英国男装品牌
2019/10/22 全球购物
铭立家具面试题
2012/12/06 面试题
秘书英文求职信范文
2014/01/31 职场文书
2014新生大学四年计划书
2014/09/21 职场文书
诉讼代理人授权委托书
2014/10/11 职场文书
员工工作表现自我评价
2015/03/06 职场文书
消防隐患整改通知书
2015/04/22 职场文书
预备党员转正党小组意见
2015/06/01 职场文书
XX部保密工作制度范本
2019/08/27 职场文书
python字符串拼接.join()和拆分.split()详解
2021/11/23 Python
Java并发编程之原子性-Atomic的使用
2022/03/16 Java/Android