jquery gets Chinese garbled characters in url

In web development, we often need to use jQuery to obtain parameters in the URL. However, when the URL contains Chinese characters, we can easily encounter the problem of Chinese garbled characters. In this article, we will introduce how to use jQuery to obtain Chinese parameters in the URL, and how to deal with the problem of Chinese garbled characters.

1. Get the parameters in the URL

There are usually two ways to get the parameters in the URL:

1. Use the window.location.search method to get the parameter string , and then parsed into key-value pairs.
2. Use regular expressions to match parameters in the URL.

Below we introduce these two methods respectively.

1. Use the window.location.search method to obtain the parameter string

The window.location.search method can obtain the parameter string in the URL, for example:

http://example.com/index.html?id=123&name=张三

You can use the following code to get the parameter string:

var paramsStr = window.location.search; // 返回 ?id=123&name=张三

Then, we can use the JavaScript built-in function decodeURIComponent() to parse the parameter string and convert it into a key-value pair:

function getParams(url) {
  var paramsStr = url.split("?")[1];  // 获取参数字符串
  var paramsArr = paramsStr.split("&");  // 将参数字符串转换为数组
  var paramsObj = {};
  for (var i = 0, len = paramsArr.length; i < len; i++) {
    var arr = paramsArr[i].split("=");
    var name = decodeURIComponent(arr[0]);  // 解码中文字符
    var value = decodeURIComponent(arr[1]);
    paramsObj[name] = value;  // 将键值对添加到paramsObj中
  }
  return paramsObj;
}

var params = getParams(window.location.href);
console.log(params.id);  // 输出 123
console.log(params.name);  // 输出 张三

Pay attention here to use decodeURIComponent() to decode Chinese characters, otherwise garbled characters will occur.

2. Use regular expressions to match parameters in the URL

Regular expressions can match specified parameter values ​​in the URL, for example:

http://example.com/index.html?id=123&name=张三

can Use the following regular expression to match the value of the id parameter:

var url = window.location.href;
var idReg = /id=(d+)/;
var id = idReg.exec(url)[1];
console.log(id);  // 输出 123

The regular expression id=(d) is used here to match the value of the id parameter, where d represents a number and represents multiple numbers, () is used for grouping Capture matching results.

2. Dealing with the problem of Chinese garbled characters

When obtaining the Chinese parameters in the URL, we often encounter the problem of Chinese garbled characters. This is because the Chinese characters in the URL need to be encoded to be transmitted correctly. Therefore, we need to decode Chinese characters when obtaining URL parameter values, otherwise garbled characters will appear.

In JavaScript, we can use the built-in functions encodeURIComponent() and decodeURIComponent() to encode and decode Chinese characters in the URL.

1. encodeURIComponent()

encodeURIComponent() function is used to encode characters in the URL except letters, numbers, (,),.,!,~,*,',- Special characters other than _ are encoded. For example:

var str = "http://example.com/index.html?id=123&name=张三";
var encoded = encodeURIComponent(str);
console.log(encoded);  // 输出 http%3A%2F%2Fexample.com%2Findex.html%3Fid%3D123%26name%3D%E5%BC%A0%E4%B8%89

Note that the encodeURIComponent() function will not encode spaces, but if you need to encode spaces, you can use the function replace() to replace the space characters:

var str = "http://example.com/index.html?id=123&name=张 三";
var encoded = encodeURIComponent(str.replace(/s/g, "%20"));
console.log(encoded);  // 输出 http%3A%2F%2Fexample.com%2Findex.html%3Fid%3D123%26name%3D%E5%BC%A0%20%E4%B8%89

2. decodeURIComponent()

decodeURIComponent() function is used to decode special characters in the URL, for example:

var str = "http%3A%2F%2Fexample.com%2Findex.html%3Fid%3D123%26name%3D%E5%BC%A0%E4%B8%89";
var decoded = decodeURIComponent(str);
console.log(decoded);  // 输出 http://example.com/index.html?id=123&name=张三

It should be noted that if the Chinese characters in the URL are not processed correctly Encoding will cause garbled characters in decoding. If you encounter this situation, you can use the function unescape() to decode the URL:

var str = "http://example.com/index.html?id=123&name=张三";
var encoded = escape(str); // 编码
var decoded = unescape(encoded); // 解码
console.log(decoded); // 输出 http://example.com/index.html?id=123&name=张三

Note here that the unescape() function has been abandoned and is not recommended. It is recommended to correctly encode Chinese characters when transmitting URLs to avoid garbled characters.

3. Conclusion

Obtaining parameters in the URL is a basic operation in Web development, and the problem of Chinese garbled characters is also a common development difficulty. To avoid these problems, we can use the encodeURIComponent() and decodeURIComponent() functions to encode and decode the URL. At the same time, Chinese characters also need to be decoded when obtaining URL parameter values, otherwise garbled characters will appear. Although these operations may be a little tedious, they are indispensable for Chinese websites.

The above is the detailed content of jquery gets Chinese garbled characters in url. For more information, please follow other related articles on the PHP Chinese website!