首页 > 编程语言 >javascript url 传递参数中文乱码问题解决方案

javascript url 传递参数中文乱码问题解决方案

时间:2024-07-04 13:26:22浏览次数:15  
标签:中文 示例 url javascript param 乱码 URL 参数 let

在 JavaScript 中,传递 URL 参数时,如果参数包含中文字符,可能会出现乱码问题。解决这一问题可以使用 encodeURIComponent 和 decodeURIComponent 函数。这些函数会对 URL 参数进行编码和解码,确保特殊字符(包括中文字符)能够被正确传递和解析。

以下是一个完整的解决方案示例:

 1. 传递参数(编码)

在传递 URL 参数时,可以使用 encodeURIComponent 对参数进行编码:

javascript
// 中文参数
let param = "中文测试";

// 编码参数
let encodedParam = encodeURIComponent(param);

// 构建URL
let url = https://example.com?param=${encodedParam};
console.log(url);  // 输出:https://example.com?param=%E4%B8%AD%E6%96%87%E6%B5%8B%E8%AF%95


 2. 接收参数(解码)

在接收 URL 参数时,可以使用 decodeURIComponent 对参数进行解码:

javascript
// 获取URL参数
let urlParams = new URLSearchParams(window.location.search);

// 获取并解码参数
let decodedParam = decodeURIComponent(urlParams.get('param'));
console.log(decodedParam);  // 输出:中文测试


 示例代码

下面是一个完整的示例,包括传递和接收中文参数:

html
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>URL Parameter Example</title>
</head>
<body>
    <script>
        // 示例传递参数
        let param = "中文测试";
        let encodedParam = encodeURIComponent(param);
        let url = https://example.com?param=${encodedParam};
        console.log("Encoded URL: " + url);  // 输出编码后的URL

        // 示例接收参数(假设当前URL包含参数)
        let currentUrlParams = new URLSearchParams(window.location.search);
        let receivedParam = decodeURIComponent(currentUrlParams.get('param'));
        console.log("Decoded Parameter: " + receivedParam);  // 输出解码后的参数
    </script>
</body>
</html>

标签:中文,示例,url,javascript,param,乱码,URL,参数,let
From: https://blog.csdn.net/ruky36/article/details/140177167

相关文章

  • drduino串口通信中文乱码
    ​第一次使用Arduino板学习时,遇到了串口工具接收乱码的问题。最初认为可能是数据位或停止位设置不正确。当前设置如下:波特率:9600数据位:8校验位:无停止位:1在Arduino代码中使用Serial.begin(9600)进行初始化。Serial.begin(9600):-波特率:9600-数据位:8-校验位:无-停......
  • 【JavaScript脚本宇宙】高效Web开发利器:全面解析六大HTML解析器与DOM库
    精益求精:揭秘六个改变Web开发的HTML解析与DOM操作工具前言在现代Web开发中,HTML解析器和DOM操作库是不可或缺的工具。无论是爬取数据、处理复杂的HTML文档,还是模拟浏览器环境,这些工具都扮演着关键角色。本文将深入探讨六个广泛使用的HTML解析器和DOM操作库,它们分别是:htmlpa......
  • html+JavaScript+css 24点计算器
    源代码    采用穷举计算方法讲人话:根据四个数随机列算式,算出来是24就显示在列表里。<!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"><metaname="viewport"content="width=device-width,initial-scale=1.0">&l......
  • 【JavaScript】聊聊js中关于this的指向
    前言最近在看回JavaScript的面试题,this指向问题是入坑前端必须了解的知识点,现在迎来了ES6+的时代,因为箭头函数的出现,所以感觉有必要对this问题梳理一下,所以刚好总结一下JavaScript中this指向的问题。什么是JavaScript在了解this指向的问题前,首先得了解一下什么是JavaScript......
  • JavaScript
    JS引擎定义浏览器的核心是渲染引擎、JS引擎。JS引擎是用来执行JS代码的,JS引擎的快慢对网页速度有着重大影响。简单来说,JS解析引擎是能够“读懂JS代码并准确地给出代码运行结果的一段程序。”。对于静态语言而言,如C、C++、Java等,处理上述事情的叫做“编译器(compiler)”,对于动......
  • 设置Accept-Encoding为gzip,deflate,返回的网页是乱码
    设置Accept-Encoding为gzip,deflate,返回的网页是乱码用C#写代码去获取网页内容。 其中request的header中,设置Accept-Encoding为gzip,deflate:req=(HttpWebRequest)WebRequest.Create(gSkydriveUrl);req.Headers.Add("Accept-Encoding","gzip,deflate");结果始终......
  • ArcGIS API for Javascript解决html2canvas、domtoimage截图地图出现空白问题
    原因使用html2canvas、domtoimage进行截图时,会出现地图面板是空白的情况,报错如下:#1133msUnabletocloneWebGLcontextasithaspreserveDrawingBuffer=false<canvasstyle=​"width:​100%;​height:​100%;​>在通过ArcGISAPIforJavaScript4.X版本实例化地图的......
  • 使用Filter接口编写过滤器解决post乱码
    在使用tomcat9以及之前的版本,request-character-encoding和response-character-encoding使用的字符编码默认不是utf-8,所以导致前端发送到后台的中文乱码.如果使用的是tomcat10以及之后的版本,在apache-tomcat-10.1.25\conf\web.xml已设置好默认的字符集编码为utf-8,如果所示:......
  • jmeter之CSV文件传参乱码
    1.使用xlsx文件设置参数进行传参,  2.请求之后解析为乱码,原因是xlsx文件编码格式不是UTF-8 解决方案1.文另存为CSVUTF-8格式 2.保存完成后选择对应文件传参 3.运行后解析正确,没有乱码 ......
  • 用JavaScript来优化数独验证的过程
    问题陈述给定一个9x9数独棋盘,确定它是否有效。棋盘由一个二维数组表示,其中空单元格用表示'.'。有效的数独棋盘满足以下规则:每行必须包含数字1–9,且不能重复。每列必须包含数字1–9,且不能重复。九个3x3子网格中的每一个都必须包含数字1–9,且不能重复。初步方法一种简......