» » » [javascript] 環境依存文字の文字化け対応
2015-05-14

2015-05-14 22:00

環境依存文字の文字化け対応

環境依存文字(①、②などの特殊文字)が文字化けしてしまった場合、 ページをUTF-8に変える等、色々な方法があると思いますが、 今回は、環境依存文字テーブルを利用して、Javascript側でHEX(HTML)に置換し サーバ側に送る方法について紹介したいと思います。


JavaScript

・ソース説明
画面上の全input:text, textareaを取得し、該当の入力欄の文字列の中に環境依存文字(特殊文字)テーブルの文字が含まれている場合、HEXに置換しHTMLタグとしてサーバに送信する

以下のJavaScriptコードをreplace-code.jsなどの名前に保存してください。

/**
 * 置換する環境依存文字テーブル
 * http://www.asahi-net.or.jp/~ax2s-kmtn/ref/cref_num.html
 * 参照
 */
var replaceUnicode = {
"2460":"1", "2461":"1","2462":"1","2463":"1","2464":"1","2465":"1",
"2466":"1", "2467":"1","2468":"1","2469":"1","246A":"1","246B":"1",
"246C":"1", "246D":"1","246E":"1","246F":"1","2470":"1","2471":"1",
"2472":"1", "2473":"1","2160":"1","2161":"1","2162":"1","2163":"1",
"2164":"1", "2165":"1","2166":"1","2167":"1","2168":"1","2169":"1",
"3349":"1", "3314":"1","3322":"1","334D":"1","3318":"1","3327":"1",
"3303":"1", "3336":"1","3351":"1","3357":"1","330D":"1","3326":"1",
"3323":"1", "332B":"1","334A":"1","333B":"1","339C":"1","339D":"1",
"339E":"1", "338E":"1","338F":"1","33C4":"1","33A1":"1","337B":"1",
"301D":"1", "301F":"1","2116":"1","33CD":"1","2121":"1","32A4":"1",
"32A5":"1", "32A6":"1","32A7":"1","32A8":"1","3231":"1","3232":"1",
"3239":"1", "337E":"1","337D":"1","337C":"1","2252":"1","2261":"1",
"222B":"1", "222E":"1","2211":"1","221A":"1","22A5":"1","2220":"1",
"221F":"1", "22BF":"1","2235":"1","2229":"1","222A":"1",
"7E8A":"1", "891C":"1","9348":"1","9288":"1","84DC":"1","4FC9":"1",
"70BB":"1", "6631":"1","68C8":"1","92F9":"1","66FB":"1","5F45":"1",
"4E28":"1", "4EE1":"1","4EFC":"1","4F00":"1","4F03":"1","4F39":"1",
"4F56":"1", "4F92":"1","4F8A":"1","4F9A":"1","4F94":"1","4FCD":"1",
"5040":"1", "5022":"1","4FFF":"1","501E":"1","5046":"1","5070":"1",
"5042":"1", "5094":"1","50F4":"1","50D8":"1","514A":"1","5164":"1",
"519D":"1", "51BE":"1","51EC":"1","5215":"1","529C":"1","52A6":"1",
"52C0":"1", "52DB":"1","5300":"1","5307":"1","5324":"1","5372":"1",
"5393":"1", "53B2":"1","53DD":"1","FA0E":"1","549C":"1","548A":"1",
"54A9":"1", "54FF":"1","5586":"1","5759":"1","5765":"1","57AC":"1",
"57C8":"1", "57C7":"1","FA0F":"1","FA10":"1","589E":"1","58B2":"1",
"590B":"1", "5953":"1","595B":"1","595D":"1","5963":"1","59A4":"1",
"59BA":"1", "5B56":"1","5BC0":"1","752F":"1","5BD8":"1","5BEC":"1",
"5C1E":"1", "5CA6":"1","5CBA":"1","5CF5":"1","5D27":"1","5D53":"1",
"FA11":"1", "5D42":"1","5D6D":"1","5DB8":"1","5DB9":"1","5DD0":"1",
"5F21":"1", "5F34":"1","5F67":"1","5FB7":"1",
"5FDE":"1", "605D":"1","6085":"1","608A":"1","60DE":"1","60D5":"1",
"6120":"1", "60F2":"1","6111":"1","6137":"1","6130":"1","6198":"1",
"6213":"1", "62A6":"1","63F5":"1","6460":"1","649D":"1","64CE":"1",
"654E":"1", "6600":"1","6615":"1","663B":"1","6609":"1","662E":"1",
"661E":"1", "6624":"1","6665":"1","6657":"1","6659":"1","FA12":"1",
"6673":"1", "6699":"1","66A0":"1","66B2":"1","66BF":"1","66FA":"1",
"670E":"1", "F929":"1","6766":"1","67BB":"1","6852":"1","67C0":"1",
"6801":"1", "6844":"1","68CF":"1","FA13":"1","6968":"1","FA14":"1",
"6998":"1", "69E2":"1","6A30":"1","6A6B":"1","6A46":"1","6A73":"1",
"6A7E":"1", "6AE2":"1","6AE4":"1","6BD6":"1","6C3F":"1","6C5C":"1",
"6C86":"1", "6C6F":"1","6CDA":"1","6D04":"1","6D87":"1","6D6F":"1",
"6D96":"1", "6DAC":"1","6DCF":"1","6DF8":"1","6DF2":"1","6DFC":"1",
"6E39":"1", "6E5C":"1","6E27":"1","6E3C":"1","6EBF":"1","6F88":"1",
"6FB5":"1", "6FF5":"1","7005":"1","7007":"1","7028":"1","7085":"1",
"70AB":"1", "710F":"1","7104":"1","715C":"1","7146":"1","7147":"1",
"FA15":"1", "71C1":"1","71FE":"1","72B1":"1",
"72BE":"1", "7324":"1","FA16":"1","7377":"1","73BD":"1","73C9":"1",
"73D6":"1", "73E3":"1","73D2":"1","7407":"1","73F5":"1","7426":"1",
"742A":"1", "7429":"1","742E":"1","7462":"1","7489":"1","749F":"1",
"7501":"1", "756F":"1","7682":"1","769C":"1","769E":"1","769B":"1",
"76A6":"1", "FA17":"1","7746":"1","52AF":"1","7821":"1","784E":"1",
"7864":"1", "787A":"1","7930":"1","FA18":"1","FA19":"1","FA1A":"1",
"7994":"1", "FA1B":"1","799B":"1","7AD1":"1","7AE7":"1","FA1C":"1",
"7AEB":"1", "7B9E":"1","FA1D":"1","7D48":"1","7D5C":"1","7DB7":"1",
"7DA0":"1", "7DD6":"1","7E52":"1","7F47":"1","7FA1":"1","FA1E":"1",
"8301":"1", "8362":"1","837F":"1","83C7":"1","83F6":"1","8448":"1",
"84B4":"1", "8553":"1","8559":"1","856B":"1","FA1F":"1","85B0":"1",
"FA20":"1", "FA21":"1","8807":"1","88F5":"1","8A12":"1","8A37":"1",
"8A79":"1", "8AA7":"1","8ABE":"1","8ADF":"1","FA22":"1","8AF6":"1",
"8B53":"1", "8B7F":"1","8CF0":"1","8CF4":"1","8D12":"1","8D76":"1",
"FA23":"1", "8ECF":"1","FA24":"1","FA25":"1","9067":"1","90DE":"1",
"FA26":"1", "9115":"1","9127":"1","91DA":"1",
"91D7":"1", "91DE":"1","91ED":"1","91EE":"1","91E4":"1","91E5":"1",
"9206":"1", "9210":"1","920A":"1","923A":"1","9240":"1","923C":"1",
"924E":"1", "9259":"1","9251":"1","9239":"1","9267":"1","92A7":"1",
"9277":"1", "9278":"1","92E7":"1","92D7":"1","92D9":"1","92D0":"1",
"FA27":"1", "92D5":"1","92E0":"1","92D3":"1","9325":"1","9321":"1",
"92FB":"1", "FA28":"1","931E":"1","92FF":"1","931D":"1","9302":"1",
"9370":"1", "9357":"1","93A4":"1","93C6":"1","93DE":"1","93F8":"1",
"9431":"1", "9445":"1","9448":"1","9592":"1","F9DC":"1","FA29":"1",
"969D":"1", "96AF":"1","9733":"1","973B":"1","9743":"1","974D":"1",
"974F":"1", "9751":"1","9755":"1","9857":"1","9865":"1","FA2A":"1",
"FA2B":"1", "9927":"1","FA2C":"1","999E":"1","9A4E":"1","9AD9":"1",
"9ADC":"1", "9B75":"1","9B72":"1","9B8F":"1","9BB1":"1","9BBB":"1",
"9C00":"1", "9D70":"1","9D6B":"1","FA2D":"1","9E19":"1","9ED1":"1",
"2170":"1", "2171":"1","2172":"1","2173":"1","2174":"1","2175":"1",
"2176":"1", "2177":"1","2178":"1","2179":"1","FFE2":"1","FFE4":"1",
"FF07":"1", "FF02":"1",
"2170":"1", "2171":"1","2172":"1","2173":"1","2174":"1","2175":"1",
"2176":"1", "2177":"1","2178":"1","2179":"1","2160":"1","2161":"1",
"2162":"1", "2163":"1","2164":"1","2165":"1","2166":"1","2167":"1",
"2168":"1", "2169":"1","FFE2":"1","FFE4":"1","FF07":"1","FF02":"1",
"3231":"1", "2116":"1","2121":"1","2235":"1","7E8A":"1","891C":"1",
"9348":"1", "9288":"1","84DC":"1","4FC9":"1","70BB":"1","6631":"1",
"68C8":"1", "92F9":"1","66FB":"1","5F45":"1","4E28":"1","4EE1":"1",
"4EFC":"1", "4F00":"1","4F03":"1","4F39":"1","4F56":"1","4F92":"1",
"4F8A":"1", "4F9A":"1","4F94":"1","4FCD":"1","5040":"1","5022":"1",
"4FFF":"1", "501E":"1","5046":"1","5070":"1","5042":"1","5094":"1",
"50F4":"1", "50D8":"1","514A":"1","5164":"1","519D":"1","51BE":"1",
"51EC":"1", "5215":"1","529C":"1","52A6":"1","52C0":"1","52DB":"1",
"5300":"1", "5307":"1","5324":"1","5372":"1","5393":"1","53B2":"1",
"53DD":"1", "FA0E":"1","549C":"1","548A":"1","54A9":"1","54FF":"1",
"5586":"1", "5759":"1","5765":"1","57AC":"1","57C8":"1","57C7":"1",
"FA0F":"1", "FA10":"1","589E":"1","58B2":"1",
"590B":"1", "5953":"1","595B":"1","595D":"1","5963":"1","59A4":"1",
"59BA":"1", "5B56":"1","5BC0":"1","752F":"1","5BD8":"1","5BEC":"1",
"5C1E":"1", "5CA6":"1","5CBA":"1","5CF5":"1","5D27":"1","5D53":"1",
"FA11":"1", "5D42":"1","5D6D":"1","5DB8":"1","5DB9":"1","5DD0":"1",
"5F21":"1", "5F34":"1","5F67":"1","5FB7":"1","5FDE":"1","605D":"1",
"6085":"1", "608A":"1","60DE":"1","60D5":"1","6120":"1","60F2":"1",
"6111":"1", "6137":"1","6130":"1","6198":"1","6213":"1","62A6":"1",
"63F5":"1", "6460":"1","649D":"1","64CE":"1","654E":"1","6615":"1",
"663B":"1", "6609":"1","662E":"1","661E":"1","6624":"1","6665":"1",
"6657":"1", "6659":"1","FA12":"1","6673":"1","6699":"1","66A0":"1",
"66B2":"1", "66BF":"1","66FA":"1","670E":"1","F929":"1","6766":"1",
"67BB":"1", "6852":"1","67C0":"1","6801":"1","6844":"1","68CF":"1",
"FA13":"1", "6968":"1","FA14":"1","6998":"1","69E2":"1","6A30":"1",
"6A6B":"1", "6A46":"1","6A73":"1","6A7E":"1","6AE2":"1","6AE4":"1",
"6BD6":"1", "6C3F":"1","6C5C":"1","6C86":"1","6C6F":"1","6CDA":"1",
"6D04":"1", "6D87":"1","6D6F":"1",
"6D96":"1", "6DAC":"1","6DCF":"1","6DF8":"1","6DF2":"1","6DFC":"1",
"6E39":"1", "6E5C":"1","6E27":"1","6E3C":"1","6EBF":"1","6F88":"1",
"6FB5":"1", "6FF5":"1","7005":"1","7007":"1","7028":"1","7085":"1",
"70AB":"1", "710F":"1","7104":"1","715C":"1","7146":"1","7147":"1",
"FA15":"1", "71C1":"1","71FE":"1","72B1":"1","72BE":"1","7324":"1",
"FA16":"1", "7377":"1","73BD":"1","73C9":"1","73D6":"1","73E3":"1",
"73D2":"1", "7407":"1","73F5":"1","7426":"1","742A":"1","7429":"1",
"742E":"1", "7462":"1","7489":"1","749F":"1","7501":"1","756F":"1",
"7682":"1", "769C":"1","769E":"1","769B":"1","76A6":"1","FA17":"1",
"7746":"1", "52AF":"1","7821":"1","784E":"1","7864":"1","787A":"1",
"7930":"1", "FA18":"1","FA19":"1","FA1A":"1","7994":"1","FA1B":"1",
"799B":"1", "7AD1":"1","7AE7":"1","FA1C":"1","7AEB":"1","7B9E":"1",
"FA1D":"1", "7D48":"1","7D5C":"1","7DB7":"1","7DA0":"1","7DD6":"1",
"7E52":"1", "7F47":"1","7FA1":"1","FA1E":"1","8301":"1","8362":"1",
"837F":"1", "83C7":"1","83F6":"1","8448":"1","84B4":"1","8553":"1",
"8559":"1", "856B":"1","FA1F":"1","85B0":"1",
"FA20":"1", "FA21":"1","8807":"1","88F5":"1","8A12":"1","8A37":"1",
"8A79":"1", "8AA7":"1","8ABE":"1","8ADF":"1","FA22":"1","8AF6":"1",
"8B53":"1", "8B7F":"1","8CF0":"1","8CF4":"1","8D12":"1","8D76":"1",
"FA23":"1", "8ECF":"1","FA24":"1","FA25":"1","9067":"1","90DE":"1",
"FA26":"1", "9115":"1","9127":"1","91DA":"1","91D7":"1","91DE":"1",
"91ED":"1", "91EE":"1","91E4":"1","91E5":"1","9206":"1","9210":"1",
"920A":"1", "923A":"1","9240":"1","923C":"1","924E":"1","9259":"1",
"9251":"1", "9239":"1","9267":"1","92A7":"1","9277":"1","9278":"1",
"92E7":"1", "92D7":"1","92D9":"1","92D0":"1","FA27":"1","92D5":"1",
"92E0":"1", "92D3":"1","9325":"1","9321":"1","92FB":"1","FA28":"1",
"931E":"1", "92FF":"1","931D":"1","9302":"1","9370":"1","9357":"1",
"93A4":"1", "93C6":"1","93DE":"1","93F8":"1","9431":"1","9445":"1",
"9448":"1", "9592":"1","F9DC":"1","FA29":"1","969D":"1","96AF":"1",
"9733":"1", "973B":"1","9743":"1","974D":"1","974F":"1","9751":"1",
"9755":"1", "9857":"1","9865":"1","FA2A":"1","FA2B":"1","9927":"1",
"FA2C":"1", "999E":"1","9A4E":"1","9AD9":"1",
"9ADC":"1", "9B75":"1","9B72":"1","9B8F":"1","9BB1":"1","9BBB":"1",
"9C00":"1", "9D70":"1","9D6B":"1","FA2D":"1","9E19":"1","9ED1":"1"};

/**
 * 画面上の入力欄の環境依存文字があるか
 * 確認し、置換作業を行う
 */
function startReplaceSpecialCharacter() {
 
 //画面上のinput:text, textarea
 //リストを取得する
 var textInputs;
 if (document.querySelectorAll) {
  textInputs = document.querySelectorAll('input[type=text],textarea');
 } else {
  textInputs = [];
  var unfiltered = document.getElementsByTagName("input"),
   i = unfiltered.length,
   input;
  while(i--) {
   input = unfiltered[i];
   if (!input.type || input.type === 'text') {
    textInputs.push(input);
   }
  }

  unfiltered = document.getElementsByTagName("textarea"),
   i = unfiltered.length,
   input;
  while(i--) {
   input = unfiltered[i];
   textInputs.push(input);
  }

 }
 
 //環境依存文字がある場合は
 //Ｈｅｘに変換
 for (var inx = 0; inx < textInputs.length; inx ++) {
  var e = textInputs[inx];
  var text = e.value;
  var rtnText = "";
  if (text) {
   for (var i = 0; i < text.length; i ++) {
    var isCode = replaceUnicode[text.charCodeAt(i).toString(16)];
    if (isCode == 1) {
     rtnText += "&#x" + text.charCodeAt(i).toString(16)+ ";";
    } else {
     rtnText += text.charAt(i);
    }
   }
   if (rtnText) {
    e.value = rtnText;
   }
  }
 }
 

}

実際の使い方

・JavaScript追加


・メッソドの呼び出し
※submitする時に自動で変わるようにするためには、startReplaceSpecialCharacter()をsubmitされる直前に呼び出してください。
投稿者 時刻: 22:00
ラベル: ,

0 コメント:

コメントを投稿

登録: コメントの投稿 (Atom)