JS解决url传值出现中文乱码的另类办法


Posted in Javascript onApril 08, 2013

 在开发web应用时,很多情况都需要进行前后台的数据交互,有时候我们可能需要把前台的中文数据通过URL的方式传递到后台,但此时有个令人头疼的问题,因为Java中网络传输使用的标准字符集是ISO-8859-1,所以在后台用request.getParameter("message");获取前台传过来的中文时,得到的还是ISO-8859-1字符集,中文就会出现乱码现象,好多人的解决办法是在前台传递中文之前进行decode,后台再decode一下进行转换,这样感觉很是麻烦,难道就没其他的方式解决吗?

       苦思冥想了一下:为什么用表单的方式就可以传递中文,而URL的方式就不行了呢?非得用URL传值的方式才能解决问题吗?这里我想到了动态表单,何不用它来解决呢,示例如下:

       假设有如下应用场景:KPI列表页面中,对每个KPI都有生成预警数据的功能,当点击列表中每个KPI生成数据的按钮时,需要把KPI的id和name传递到后台。

       前端对应的js方法:

         用URL传值的写法:

           function createData(indexId,indexName){
                     window.location.href="catalogAction.do?action=CreateIndexData&catalogId="+indexId+"&catalogName="+indexName+"&random="+Math.random();
                   }

用这种方法,由于KPI名称大多为中文,在后台接收到的值肯定为乱码。

若用动态生成表单的方式就可以解决:

function createData(indexId,indexName){
               var urlStr =  "catalogAction.do?action=CreateIndexData&PcatalogId=<c:out value='${catalogId}'/>&catalogId="+indexId+"&random="+Math.random();
               var f= document.createElement('form');
               f.action = urlStr;
               f.method = 'post';
               document.body.appendChild(f);
               var temp=document.createElement('input');
               temp.type= 'hidden';
               temp.value=indexName; 
               temp.name='catalogName';
               f.appendChild(temp);
               f.submit();
}

对中文字段用form的方式提交过去,不是中文的仍然用URL传,这样就轻松解决了向后台传递中文出现乱码的情况。
Javascript 相关文章推荐
JavaScript高级程序设计 DOM学习笔记
Sep 10 Javascript
深入理解JavaScript系列(6) 强大的原型和原型链
Jan 15 Javascript
每天一篇javascript学习小结(RegExp对象)
Nov 17 Javascript
Bootstrap实现水平排列的表单
Jul 04 Javascript
JAVA Web实时消息后台服务器推送技术---GoEasy
Nov 04 Javascript
Layui table 组件的使用之初始化加载数据、数据刷新表格、传参数
Sep 11 Javascript
Angular4.0中引入laydate.js日期插件的方法教程
Dec 25 Javascript
详解react-router 4.0 下服务器如何配合BrowserRouter
Dec 29 Javascript
Angular(5.2-&gt;6.1)升级小结
Dec 27 Javascript
bootstrap-table formatter 使用vue组件的方法
May 09 Javascript
JavaScript 禁止用户保存图片的实现代码
Apr 28 Javascript
js闭包和垃圾回收机制示例详解
Mar 01 Javascript
JS继承--原型链继承和类式继承
Apr 08 #Javascript
原生js实现shift/ctrl/alt按键的获取
Apr 08 #Javascript
原生js实现跨浏览器获取鼠标按键的值
Apr 08 #Javascript
纯js实现瀑布流展现照片(自动适应窗口大小)
Apr 08 #Javascript
javascript中常用编程知识
Apr 08 #Javascript
利用webqq协议使用python登录qq发消息源码参考
Apr 08 #Javascript
setInterval,setTimeout与jquery混用的问题
Apr 08 #Javascript
You might like
MySQL数据源表结构图示
2008/06/05 PHP
PHPMyAdmin 快速配置方法
2009/05/11 PHP
php 计划任务 检测用户连接状态
2012/03/29 PHP
PHP结合JQueryJcrop实现图片裁切实例详解
2014/07/24 PHP
可以把编码转换成 gb2312编码lib.UTF8toGB2312.js
2007/08/21 Javascript
js 获取后台的字段 改变 checkbox的被选中的状态 代码
2013/06/05 Javascript
父页面显示遮罩层弹出半透明状态的dialog
2014/03/04 Javascript
使用百度地图api实现根据地址查询经纬度
2014/12/11 Javascript
jquery插件qrcode在线生成二维码
2015/04/26 Javascript
JS实现点击按钮控制Div变宽、增高及调整背景色的方法
2015/08/05 Javascript
详解javascript函数的参数
2015/11/10 Javascript
JavaScript是如何实现继承的(六种方式)
2016/03/31 Javascript
详解js前端代码异常监控
2017/01/11 Javascript
canvas时钟效果
2017/02/16 Javascript
全面解析jQuery中的$(window)与$(document)的用法区别
2017/08/15 jQuery
vue.js中引入vuex储存接口数据及调用的详细流程
2017/12/14 Javascript
详解Vue项目中出现Loading chunk {n} failed问题的解决方法
2018/09/14 Javascript
Vue.js实现大转盘抽奖总结及实现思路
2019/10/09 Javascript
小程序瀑布流组件实现翻页与图片懒加载
2020/05/19 Javascript
在vue-cli创建的项目中使用sass操作
2020/08/10 Javascript
js在HTML的三种引用方式详解
2020/08/29 Javascript
python实现RSA加密(解密)算法
2016/02/17 Python
python中快速进行多个字符替换的方法小结
2016/12/15 Python
Sanic框架蓝图用法实例分析
2018/07/17 Python
深入理解Python中的 __new__ 和 __init__及区别介绍
2018/09/17 Python
Python中判断子串存在的性能比较及分析总结
2019/06/23 Python
python networkx 根据图的权重画图实现
2019/07/10 Python
python对常见数据类型的遍历解析
2019/08/27 Python
OpenCV4.1.0+VS2017环境配置的方法步骤
2020/07/09 Python
Famous Footwear加拿大:美国多品牌运动休闲鞋店
2018/12/05 全球购物
经理秘书岗位职责
2013/11/14 职场文书
城市精细化管理实施方案
2014/03/04 职场文书
实习指导老师意见
2015/06/04 职场文书
JS一分钟在github+Jekyll的博客中添加访问量功能的实现
2021/04/03 Javascript
OpenCV-Python使用cv2实现傅里叶变换
2021/06/09 Python
vue 给数组添加新对象并赋值
2022/04/20 Vue.js