jQueryの$.ajaxや$.loadなどでファイルを読み込むと文字化けが発生する

jQueryの$.ajaxや$.loadなどでファイルを読み込むと文字化けが発生することがあります。

【JavaScript】

$.ajax({ url : 'data/example.csv', dataType : 'text', success : function(resText) { // 処理 } });

原因

jQueryの$.ajaxでは、UTF-8で読み込もうとするため、読み込むファイル内にマルチバイトを含み、かつファイルの文字コードがShift_JISである場合にこの現象が起こります。

回避方法

この不具合（バグ）は以下の方法で回避することができます。

• overrideMimeTypeメソッドでMimeTypeをオーバーライドする。

overrideMimeTypeメソッドでMIMEタイプをオーバーライドする。

XMLHttpRequestオブジェクトのoverrideMimeTypeメソッドを使用して、MIMEタイプをオーバーライドすることで回避できます。

• ※ IEについてはoverrideMimeTypeメソッドは10以降で対応されているので、IE10以前のブラウザではこの方法は使用できません。

$.ajaxSetup({ beforeSend : function(xhr) { xhr.overrideMimeType('text/html;charset=Shift_JIS'); } }); $.ajax({ url : 'data/example.csv', dataType : 'text', success : function(resText) { // 処理 } });