常见开发需求之js处理url汉字编码中的乱码
需求及解决
两个页面传值的需求是很常见的,angular中有很多常见的方法用于传值,而且都不会受到字符编码的影响,而采用传统的url中拼字符串进行传值的操作,如果拼串中涉及到中文字符,我们就要考虑页面的编码问题了。
如如下的地址
http://www.xxx.com/ddd?type=10&gn=你好
经过url编码转变为
http://www.xxx.com/ddd?type=10&gn=%E5%81
从而导致如果直接获取这个值会出现异常显示
通常我们要解决两个问题:
- 将search部分可能存在编码的字符串从地址中提取出来,如需要处理编码的其实就只是gn这个参数
- 判断该字符串是否进行了编码,并对其进行操作
网上有很多方法,使用起来效率不高而且还报错,我这里总结了一个可用的,代码如下:
//传入可能出现编码的key值,返回相应的value
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;
}
//测试用的数据
var gn = GetQueryString("gn");
//判断gn是否编码,如果编码了就进行解码
if(!(gn.indexOf( "%" )<0)) {
gn = decodeURI(gn);
}
核心原理是使用正则匹配,然后判断字符串是否以%开头,所以这种方法只适用于url编码的问题,其他编码大家自行修改就成。
常见开发需求之js处理url汉字编码中的乱码的更多相关文章
- 用JS解决url地址中参数乱码的问题
var url = window.location.herf;//获取url地址 var obj = {}; //最后输出的对象 var reg = /\?/; //要匹配的正则表达式 if(url. ...
- 常见开发需求之前端利器webstorm中的git和快捷键
需求 前端开发中我们最常用的一般是webstorm.hbuilder和sublime,因为以前使用过一段时间eclipse所以我对webstorm的感觉比较良好,再加上以前使用hbuilder维护 ...
- js获取url(request)中的参数
index.htm?参数1=数值1&参数2=数值2&参数3=数据3&参数4=数值4&...... 静态html文件js读取url参数,根据获取html的参数值控制htm ...
- URL地址中中文乱码详解(javascript中encodeURI和decodeURI方法、java.net.URLDecoder.encode、java.net.URLDecoder.decode)
引言: 在Restful类的服务设计中,经常会碰到需要在URL地址中使用中文作为的参数的情况,这种情况下,一般都需要正确的设置和编码中文字符信息.乱码问题就此产生了,该如何解决呢?且听本文详细道来. ...
- 常见开发需求之angular上拉加载更多
需求 移动端使用angular实现上拉加载更多的条目,这个需求比较常见,网上的插件改动起来比较麻烦,不如自己写一个最适合,以前有同事写了一个,奈何bug太多,后来改分页了,我们产品说什么都让做,没 ...
- js获取url链接中的域名部分
用js提取出url中的域名(domain)部分,用split()函数就可以了. 因为一个正确的url必定是由http://或者是https://.domain.路径/参数组成,所以可以用split以/ ...
- vagrant nginx php开发环境中浏览器访问js文件,文件中出现乱码的解决方法
当nginx配置 sendfile设置为on时,某些js文件中会出现奇怪的字符: ����������������� 不管怎么刷新,重启服务都无效: 通过google搜索之后发现原来是因为开启send ...
- js获取URL地址中的GET参数
var $_GET = (function(){ var url = window.document.location.href.toString(); var u = url.split(" ...
- JS解决URL传递参数中文乱码问题
function getUrlParam(name){ // 用该属性获取页面 URL 地址从问号 (?) 开始的 URL(查询部分) var url = window.location.search ...
随机推荐
- noip2016 Day1T3
理解错题意了....导致考场上直接爆零TAT 正解就是期望dp啊,dp[i][j][0/1]表示前i节课用了j次机会,这一次用没用的期望代价 看代码吧 #include<iostream> ...
- ElasticSearch-5.0.0安装中文分词插件IK
Install IK 源码地址:https://github.com/medcl/elasticsearch-analysis-ik,git clone下来. 1.compile mvn packag ...
- SQL Server 数据库查找重复记录的几种方法
http://www.hanyu123.cn/html/c61/6790.html 一.查某一列(或多列)的重复值.(只可以查出重复记录的值,不能查出整个记录的信息) 例如:查找stuid,stuna ...
- Oracle 图形化以及命令行安装
@(Oracle)[Install] Oracle 安装 相关版本说明 不同版本的Oracle需要安装在特定的系统版本之上. 如Oracle 11gR2的11.2.0.1.0需要安装在CentOS 5 ...
- SqlServer 产生随机数
ALTER PROCEDURE [dbo].[usp_RandomNumber] ( , --随机数位数 --随机笔数 ) AS BEGIN DECLARE @T AS TABLE([Random N ...
- mysql GET DIAGNOSTICS 语法
MySQL 5.6 提供了 get diagnostic 语句来获取错误缓冲区的内容,然后把这些内容输出到不同范围域的变量里,以便我们后续灵活操作 语法如下: GET [CURRENT] DIAGNO ...
- 使用Xcode HeaderDoc和Doxygen文档化你的Objective-C和Swift代码
在一个应用的整个开发过程中涉及到了无数的步骤.其中一些是应用的说明,图片的创作,应用的实现,和实现过后的测试阶段.写代码可能组成了这个过程的绝大部分,因为正是它给了应用生命,但是这样还不够,与它同等重 ...
- ActiveMQ消息存储持久化
--------------------------------------------------------------------------------------------------- ...
- Javascript 俄罗斯方块 游戏代码解释!
俄罗斯方块代码说明 /** 名称:Javascript 俄罗斯方块! 作者:Gloot 邮箱:glootz@gmail.com QQ:345268267 网站:http://www.cnblogs.c ...
- spring mvc+mybatis+sql server简单配置
context.xml配置文件 <?xml version="1.0" encoding="UTF-8"?> <beans xmlns=&qu ...