传参文件：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>jq路由传参</title>
<script src="../assets/js/jquery_2.1.4.min.js" type="text/javascript" charset="utf-8"></script>
<script src="../assets/js/jqExpand.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
$(function(){
$("button").click(function() {
var testObj = {
name: "xxx",
age: 22,
country: "中国"
}
// console.log(urlEncode(testObj))
window.location.href = "jq接收路由参数.html?" + urlEncode(testObj)
})
})
</script>
</head>
<body>
<button type="button">点我携带参数跳转到子页面</button>
</body>
</html>
接收参数：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>jq接收路由参数</title>
<script src="../assets/js/jquery_2.1.4.min.js" type="text/javascript" charset="utf-8"></script>
<script src="../assets/js/jqExpand.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
$(function(){
var obj = GetRequest();
// console.log(obj)
var show = ""
Object.keys(obj).map((key)=>{
console.log(obj[key])
show += "<p>" + obj[key] + "</p>"
})
document.write(show)
})
</script>
</head>
<body>
</body>
</html>
自己封装的扩展文件(jqExpand):
/**
* paramObj 将要转为URL参数字符串的对象
* key URL参数字符串的前缀
* encode true/false 是否进行URL编码,默认为true
* js实现
* return URL参数字符串
*/
var urlEncode = function(paramObj, key, encode) {
if (paramObj == null) return '';
var paramStr = '';
var t = typeof(paramObj);
if (t == 'string' || t == 'number' || t == 'boolean') {
paramStr += '&' + key + '=' + ((encode == null || encode) ? encodeURIComponent(paramObj) : paramObj);
} else {
for (var i in paramObj) {
var k = key == null ? i : key + (paramObj instanceof Array ? '[' + i + ']' : '.' + i);
paramStr += urlEncode(paramObj[i], k, encode);
}
// console.log(paramStr)
paramStr = paramStr.replace(/^&/g, "")
}
return paramStr;
};
//根据参数名称获取url参数
function getUrlParamValue(name) {
var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");
var r = window.location.search.substr(1).match(reg);
if (r != null) return decodeURIComponent(r[2]);
return null;
}
//获取url参数封装成对象
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]] = decodeURIComponent((strs[i].split("=")[1]));
}
}
return theRequest;
}
网友评论