JS解決url傳值出現(xiàn)中文亂碼的另類辦法
在開發(fā)web應(yīng)用時,很多情況都需要進行前后臺的數(shù)據(jù)交互,有時候我們可能需要把前臺的中文數(shù)據(jù)通過URL的方式傳遞到后臺,但此時有個令人頭疼的問題,因為Java中網(wǎng)絡(luò)傳輸使用的標(biāo)準(zhǔn)字符集是ISO-8859-1,所以在后臺用request.getParameter("message");獲取前臺傳過來的中文時,得到的還是ISO-8859-1字符集,中文就會出現(xiàn)亂碼現(xiàn)象,好多人的解決辦法是在前臺傳遞中文之前進行decode,后臺再decode一下進行轉(zhuǎn)換,這樣感覺很是麻煩,難道就沒其他的方式解決嗎?
苦思冥想了一下:為什么用表單的方式就可以傳遞中文,而URL的方式就不行了呢?非得用URL傳值的方式才能解決問題嗎?這里我想到了動態(tài)表單,何不用它來解決呢,示例如下:
假設(shè)有如下應(yīng)用場景:KPI列表頁面中,對每個KPI都有生成預(yù)警數(shù)據(jù)的功能,當(dāng)點擊列表中每個KPI生成數(shù)據(jù)的按鈕時,需要把KPI的id和name傳遞到后臺。
前端對應(yīng)的js方法:
用URL傳值的寫法:
function createData(indexId,indexName){
window.location.href="catalogAction.do?action=CreateIndexData&catalogId="+indexId+"&catalogName="+indexName+"&random="+Math.random();
}
用這種方法,由于KPI名稱大多為中文,在后臺接收到的值肯定為亂碼。
若用動態(tài)生成表單的方式就可以解決:
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傳,這樣就輕松解決了向后臺傳遞中文出現(xiàn)亂碼的情況。
相關(guān)文章
基于Two.js實現(xiàn)星球環(huán)繞動畫效果的示例
本篇文章主要介紹了基于Two.js實現(xiàn)=星球環(huán)繞動畫效果的示例,小編覺得挺不錯的,現(xiàn)在分享給大家,也給大家做個參考。一起跟隨小編過來看看吧2017-11-11終于解決了IE8不支持?jǐn)?shù)組的indexOf方法
今天,測試報過來一個js bug, 在IE8下有個js錯誤,但是在其它瀏覽器下(Firefox, Chrome, IE9)下面都很正常。后來調(diào)試發(fā)現(xiàn)原因是在IE8下,js數(shù)組沒有indexOf方法。2013-04-04深入理解javascript構(gòu)造函數(shù)和原型對象
對象,是javascript中非常重要的一個梗,是否能透徹的理解它直接關(guān)系到你對整個javascript體系的基礎(chǔ)理解,說白了,javascript就是一群對象在攪。。(嗶!)。2014-09-09typeScript?核心基礎(chǔ)之接口interface
本篇文章主要介紹?typeScript?中接口是啥?如何定義的?接口是如何進行擴展的以及類如何實現(xiàn)接口,接下來和小編一起進入下面文章一起學(xué)習(xí)?typeScript?接口2022-02-02JS二進制流文件下載導(dǎo)出(接口返回二進制流)亂碼處理方法
這篇文章主要介紹了JS二進制流文件下載導(dǎo)出(接口返回二進制流)亂碼處理方法,本文給大家介紹的非常詳細,對大家的學(xué)習(xí)或工作具有一定的參考借鑒價值,需要的朋友參考下吧2023-12-12BootStrap Select清除選中的狀態(tài)恢復(fù)默認狀態(tài)
PC端項目中經(jīng)常會出現(xiàn)大量的數(shù)據(jù)列表頁面,涉及到下拉框選擇篩選條件;當(dāng)時用到bootstrap-select下拉框時該如何點擊重置按鈕就清除下拉框的選中狀態(tài)呢?下面通過本文給大家介紹下,需要的的朋友參考下吧2017-06-06