- ベストアンサー
外部ファイルにしたら文字化けしてしまいました
- ＦＣ２ブログでの外部ファイル化による文字化けの問題を解決する方法について教えてください。
- ＦＣ２ブログで下記【１】を<script type='text/javascript'><!--【１】//--></script>で囲んで直接プラグインに書き込むと文字化けせずに表示されますが、外部ファイルにして<script type='text/javascript' src='【１】のJSファイルのパス'></script>をプラグインに書き込むと文字化けしてしまいます。
- 外部ファイルでの文字化けの問題を解決するための方法や対策があれば教えてください。
- popon44
- お礼率40% (2/5)
- JavaScript
- 回答数3
- ありがとう数2
- みんなの回答 （3）
- 専門家の回答
質問者が選んだベストアンサー
自分は5歳児だろうが主婦だろうが手は抜きません。 とりあえず試しに、 <script type="text/javascript" src="JSファイルへのパス" charset="Shift-JIS"></script> ～と言う風にしてみて下さい（ charset="Shift-JIS" というのを付け足す）。それで文字化けが直るようなら、貴方のJSファイルの文字コードは「Shift-JIS」と言う事になります。FC2のBlogサービスですか？それでHPやBlogを作っているのなら、基本的には文字コードはサーバ側、つまりこの場合は「EUC-JP」に統一するべき～という事になります。 一般的に、Windowsの標準の環境だと。前段で述べた様な、様々な種類の文字コードを扱う事が出来ないので。事実上、作業は「Shift-JIS」1択と言う事になります。また『メモ帳（notepad.exe）』では「改行コード」を編集出来ないので、HTMLやJavaScript（JSファイル）を編集するには力不足です。何か特別なソフトとかを使わずに、Windows標準の『メモ帳（notepad.exe）』でJSファイルを編集したのであれば、十中八九、文字コードは「Shift-JIS」になっているはずです。 ＞文字コード 「文字コード」とは、コンピュータ上でテキストファイル（*.txt）をやり取りする時の方式の事で、現在では100種類近くの文字コードがあります。インターネット上でよく使われる文字コードは、「UTF-8」、「Shift-JIS」、「EUC-JP」～の3種類で、基本的にはこれだけ押さえておけばOKです。 考え方としては、日本語や英語のように。同じ意味を持つ文書でも色んな国の言葉で書く事が出来る様に。コンピュータ上での文書の表し方にも方言というか、色んな国の言葉がある様な物だと思ってて下さい。先に述べた「改行コード」や「BOM無し」とかは忘れて下さい。 で、初心者はコレだけ覚えて置いて欲しいのですが… ・半角英数文字だけなら文字化けは起きない ～と（実際は違いますが、話がややこしくなるので簡単にします）。半角英数文字ってのは「abc,?!#123456+-=」みたいな文字の事です。全角文字とは違うので注意して下さい（全角文字 → ａｂｃ，？！＃１２３４５６＋－＝）。従って逆説的に言えば「日本語を使う時は常に文字コードの影響を受ける」と言う事です。
その他の回答 (2)
- 4017B
- ベストアンサー率73% (1336/1814)
文字化けしてるって事は、JSファイルとそれを呼び出してるHTMLページ側との文字コードがズレてるって事じゃない？ちゃんと UTF-8、BOM無し、改行LF～で統一してますか？ 試しにJSファイル内に記述してるコメント文（//で始まる行）を全て削除して、JSファイルの中身を英数文字と記号のみにしてみて。それで文字化けが直る様なら、前述の通り100％文字コードが合ってないです。変数や配列の値に日本語が代入されてる様なら、それも削除か英数文字に変更。 P.S. JavaScriptに限らずwebの世界に出るのなら、文字コードは「UTF-8、BOM無し、改行LF」しか存在しないと思って貰った方が、後々のためにも良い結果を生むと思います。Shif-JISとかEUC-JPとかは都市伝説です。 UTF-8でテキスト編集出来ない環境なら、もうwebデザインとかHTMLコーディングとかは忘れた方が早いと思いますが。何らかの理由で暫定的に、UTF-8以外の文字コードでJavaScriptを扱わなければならない局面にぶつかったと仮定して。 <script type="text/javascript" src="./sample.js" charset="Shift-JIS"></script> ～みたいに明示的に文字コードを指定して呼び出せば、文字化けは回避出来ます。 P.P.S. 確かFC2は基本の文字コードが「euc-jp」だったと思いますので。外部ファイルの文字コードも、それに合わせないといけないと思います。各サーバ単位でもしかしたら微妙に違う可能性もあるので、実際の自分のレンタルスペースで表示されているHTMLページのソースコードを見て確認して下さい。
補足
回答、ありがとうございます。 また当方はまったくの素人で、webの世界に出るとかは とんでもございません、ごく普通の主婦なので・・・。 それを踏まえたうえで、お教えていただけたら、よろしくお願いします。 言われたように（//で始まる行）を全て削除し、【１】のようにやってみたら 半角では表示されました。 (すみません、最初に貼るコードを間違えておりました) ただし、『11111』の部分を全角『ああああ』に変えたらやはり文字化けしてしまいました。 >ちゃんと UTF-8、BOM無し、改行LF～で統一してますか？ ということは、何か【１】にコードを足すのですか？ それとも<script type="text/javascript" src="【１】のJSファイルのパス"></script> の中になにかを書き込めばいいんですかね？ またはＦＣ２ブログのテンプレートに書き込むんですか？ ちなみにテンプレートの一番上には <?xml version="1.0" encoding="euc-jp"?> とあります。 あと <head>のすぐ下に <meta http-equiv="Content-Type" content="text/html; charset=EUC-JP" /> とあります 【１】 jmp = new Array(); img = new Array(); txt = new Array(); txtjmp = new Array(); jmp[0] = "http://～"; jmp[1] = "http://～"; jmp[2] = "http://～"; img[0] = "img/img1.jpg"; img[1] = "img/img2.jpg"; img[2] = "img/img3.jpg"; txt[0] = "11111"; txt[1] = "22222"; txt[2] = "33333"; txtjmp[0] = "http://～"; txtjmp[1] = "http://～"; txtjmp[2] = "http://～"; n = Math.floor(Math.random()*jmp.length); document.write("<a href='"+jmp[n]+"'>"); document.write("<img src='"+img[n]+"' border='0' width='130' height='98'>"); document.write("</a>"); document.write('<a href="'+txtjmp[n]+'">'); document.write("<br /><!--»-->"+txt[n]+" "); document.write("</a>");
な に が 文字化けしたの？ とりあえず、文字化けったらまずは文字コードの確認ですが、それはしましたか？
補足
すみません、貼るコードを間違えていました 下記の txt[0] = "１のページへ"; txt[1] = "２のページへ"; txt[2] = "３のページへ"; の【１のページへ】 【２のページへ】 【３のページへ】が文字化けしています // ランダムに画像を表示する jmp = new Array(); img = new Array(); txt = new Array(); txtjmp = new Array(); // ジャンプ先のアドレス(数字は画像と対応) jmp[0] = "http://～"; jmp[1] = "http://～"; jmp[2] = "http://～"; // 画像のアドレス(数字はジャンプ先のアドレスと対応) img[0] = "img/img1.jpg"; img[1] = "img/img2.jpg"; img[2] = "img/img3.jpg"; // テキスト(数字はジャンプ先のアドレスと対応) txt[0] = "１のページへ"; txt[1] = "２のページへ"; txt[2] = "３のページへ"; // テキストのアドレス(数字はジャンプ先のアドレスと対応) txtjmp[0] = "http://～"; txtjmp[1] = "http://～"; txtjmp[2] = "http://～"; n = Math.floor(Math.random()*jmp.length); document.write("<a href='"+jmp[n]+"'>"); document.write("<img src='"+img[n]+"' border='0' width='130' height='98'>"); document.write("</a>"); document.write('<a href="'+txtjmp[n]+'">'); document.write("<br /><!--»-->"+txt[n]+" "); document.write("</a>");
お礼
とても分かりやすい説明ありがとうございました！ おかげさまで文字化けが直りました～！