プロが教えるわが家の防犯対策術!

FC2ブログで下記【1】を

<script type="text/javascript">
<!--
【1】
// -->
</script>

で囲んで直接プラグインに書き込んだら
文字化けせずに表示されたのですが、

外部ファイルにして

<script type="text/javascript" src="【1】のJSファイルのパス"></script>

をプラグインに書き込んだら、
画像リンクはうまく表示されたのですが、
文字化けしてしまいました。

文字化けしない方法はないでしょうか?


【1】
// ランダムに画像を表示する
jmp = new Array();
img = new Array();
// ジャンプ先のアドレス(数字は画像と対応)
jmp[0] = "http://~";
jmp[1] = "http://~";
jmp[2] = "http://~";
jmp[3] = "http://~";
jmp[4] = "http://~";
// 画像のアドレス(数字はジャンプ先のアドレスと対応)
img[0] = "img/img1.jpg";
img[1] = "img/img2.jpg";
img[2] = "img/img3.jpg";
img[3] = "img/img4.jpg";
img[4] = "img/img5.jpg";
n = Math.floor(Math.random()*jmp.length);
document.write("<a href='"+jmp[n]+"' target='_blank'>");
document.write("<img src='"+img[n]+"' border='0'>");
document.write("</a>");

A 回答 (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+-=」みたいな文字の事です。全角文字とは違うので注意して下さい(全角文字 → abc,?!#123456+-=)。従って逆説的に言えば「日本語を使う時は常に文字コードの影響を受ける」と言う事です。
    • good
    • 5
この回答へのお礼

とても分かりやすい説明ありがとうございました!
おかげさまで文字化けが直りました~!

お礼日時:2011/10/25 08:42

文字化けしてるって事は、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の世界に出るとかは
とんでもございません、ごく普通の主婦なので・・・。
それを踏まえたうえで、お教えていただけたら、よろしくお願いします。


言われたように(//で始まる行)を全て削除し、【1】のようにやってみたら
半角では表示されました。
(すみません、最初に貼るコードを間違えておりました)

ただし、『11111』の部分を全角『ああああ』に変えたらやはり文字化けしてしまいました。

>ちゃんと UTF-8、BOM無し、改行LF~で統一してますか?
ということは、何か【1】にコードを足すのですか?

それとも<script type="text/javascript" src="【1】のJSファイルのパス"></script>
の中になにかを書き込めばいいんですかね?

またはFC2ブログのテンプレートに書き込むんですか?
ちなみにテンプレートの一番上には
<?xml version="1.0" encoding="euc-jp"?>
とあります。

あと
<head>のすぐ下に
<meta http-equiv="Content-Type" content="text/html; charset=EUC-JP" />
とあります



【1】
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 /><!--&raquo;-->"+txt[n]+" ");
document.write("</a>");

補足日時:2011/10/22 10:31
    • good
    • 0

な に が 文字化けしたの?


とりあえず、文字化けったらまずは文字コードの確認ですが、それはしましたか?

この回答への補足

すみません、貼るコードを間違えていました

下記の
txt[0] = "1のページへ";
txt[1] = "2のページへ";
txt[2] = "3のページへ";
の【1のページへ】 【2のページへ】 【3のページへ】が文字化けしています


// ランダムに画像を表示する
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] = "1のページへ";
txt[1] = "2のページへ";
txt[2] = "3のページへ";
// テキストのアドレス(数字はジャンプ先のアドレスと対応)
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 /><!--&raquo;-->"+txt[n]+" ");
document.write("</a>");

補足日時:2011/10/22 10:10
    • good
    • 0

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!