js get方式传参解决中文乱码问题

最新推荐文章于 2025-06-05 09:57:29 发布

原创最新推荐文章于 2025-06-05 09:57:29 发布 · 3.5k 阅读

3 ·

CC 4.0 BY-SA版权

文章标签：

#前端 #javascript #node.js #vue

开发过程中遇到的问题整理记录专栏收录该内容

10 篇文章

订阅专栏

本文介绍两种使用JavaScript从URL中解析GET请求参数的方法，并解决了中文参数的乱码问题。第一种方法通过自定义函数遍历查询字符串，第二种方法使用正则表达式匹配参数值，两者均利用decodeURIComponent()函数确保中文字符正确显示。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

方案一、JS截取地址栏URL参数

下面两种方法解决乱码主要是使用decodeURIComponent()方法，
对截取到的值再次进行转码

测试url：https://blog.csdn.net/weixin_45792953/article/details/107860555?name=admin&pwd=123456

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);
}
let value=getQueryVariable('name');
console.log(value);
//此函数若想解决乱码问题需要使用decodeURIComponent()方法再次处理下
let value = getQueryVariable('name');
value = decodeURIComponent(value);
console.log(value);

方案二、获取get请求参数(解决中文乱码)

//采用正则匹配方式
function getQueryString(name) {
    var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");
    var r = window.location.search.substr(1).match(reg);
    if (r != null) return decodeURIComponent(r[2]);
    return "";
};