700字范文,内容丰富有趣,生活中的好帮手!
700字范文 > JavaScript 获取url参数及解决中文乱码问题

JavaScript 获取url参数及解决中文乱码问题

时间:2021-09-04 00:59:42

相关推荐

JavaScript 获取url参数及解决中文乱码问题

1.获取url参数

方法一:

// 获取url参数function getQueryVariable(variable) {var query = window.location.search.substring(1);var vars = query.split("&");for (var i = 0; i < vars.length; i++) {var pair = vars[i].split("=");if (pair[0] == variable) {return pair[1];}}return false;}

方法二:

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

直接调用函数并传递参数名即可

注意:前面方法尚未对中文进行处理,如果传递的值是中文,会产生乱码

2.解决中文乱码

方法一:encodeURI()、decodeURI()

方法二:escape()、unescape()

我们可以对中文单独加密,也可以对整个url加密

3.一个简单的例子

test1.html

<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>test1</title></head><body><div><div>点击按钮将名字参数name="罗辑",性别参数gender="男"传递到test2.html</div> <div>name使用encodeURI加密,gender使用escape加密</div><button onclick="jump()">跳转</button></div><script>let name = "罗辑"let gender = "男"function jump() {name = encodeURI(name)gender = escape(gender)let url = `file:///G:/workspace/test/test2.html?name=${name}&gender=${gender}`window.location.href = url}</script></body></html>

test2.html

<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>test2</title></head><body><div><div>我是test2.html我接收到的数据</div><div id="name"></div><div id="gender"></div></div><script>window.onload = function () {let url = window.location.hrefdocument.getElementById('name').innerText = `name = ${getQueryVariable('name')}`document.getElementById('gender').innerText = `gender = ${getQueryString('gender')}`}// 获取url参数function getQueryVariable(variable) {var query = window.location.search.substring(1);var vars = query.split("&");for (var i = 0; i < vars.length; i++) {var pair = vars[i].split("=");if (pair[0] == variable) {return decodeURI(pair[1]); // 解密方法}}return false;}// 获取url参数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;}</script></body></html>

用encodeURI()加密name,在getQueryVariable()使用decodeURI()解密

用escape()加密gender,在getQueryString()使用unescape()解密

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。