外部ファイルにしたら文字化けしてしまいました
- ＦＣ２ブログでの外部ファイル化による文字化けの問題を解決する方法について教えてください。
- ＦＣ２ブログで下記【１】を<script type='text/javascript'><!--【１】//--></script>で囲んで直接プラグインに書き込むと文字化けせずに表示されますが、外部ファイルにして<script type='text/javascript' src='【１】のJSファイルのパス'></script>をプラグインに書き込むと文字化けしてしまいます。
- 外部ファイルでの文字化けの問題を解決するための方法や対策があれば教えてください。
- ベストアンサー
外部ファイルにしたら文字化けしてしまいました
ＦＣ２ブログで下記【１】を <script type="text/javascript"> <!-- 【１】 // --> </script> で囲んで直接プラグインに書き込んだら 文字化けせずに表示されたのですが、 外部ファイルにして <script type="text/javascript" src="【１】のJSファイルのパス"></script> をプラグインに書き込んだら、 画像リンクはうまく表示されたのですが、 文字化けしてしまいました。 文字化けしない方法はないでしょうか？ 【１】 // ランダムに画像を表示する 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>");
- 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% (1305/1776)
文字化けしてるって事は、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>");
関連するQ&A
- 画像をランダムに表示し、リンクもランダムにしたい
下記の通りにしたら、ランダムに画像が表示され、 クリックすれば画像とペアになっているアドレス先に飛ぶことは出来たのですが そのときのリンク先をランダムにすることは出来ないでしょか？ 例えば、img[2] の画像が表示された場合、jmp[2] ではなく ５つのアドレスの中からランダムにリンク先が決まる、 というようなことなんですが・・・。 // ランダムに画像を表示する 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>");
- 締切済み
- JavaScript
- ランダム表示
某サイトで このようなスプリクトを手に入れたのですが 設置した際に 横310Ｘ縦190と言う 表示画像サイズの指定の仕方が わかりません いろいろ 試したのですが 素人のため なかなか うまくいきません 下のスプリクトにどこにどのようなタグを入れていいのか教えてください 皆様お力を貸してください <SCRIPT language="JavaScript"> <!-- // ランダムに画像を表示する jmp = new Array(); img = new Array(); // ジャンプ先のアドレス(数字は画像と対応) jmp[0] = "http://www.yahoo.co.jp/"; jmp[1] = "http://bb.yahoo.co.jp/"; jmp[2] = "http://www.yahoo.co.jp/"; jmp[3] = "http://auctions.yahoo.co.jp/"; jmp[4] = "http://aeu.jp/cs/"; // 画像のアドレス(数字はジャンプ先のアドレスと対応) img[0] = "img/img0.jpg"; img[1] = "img/img1.jpg"; img[2] = "img/img2.jpg"; img[3] = "img/img3.jpg"; img[4] = "img/img4.jpg"; n = Math.floor(Math.random()*jmp.length); document.write("<a href='"+jmp[n]+"'>"); document.write("<img src='"+img[n]+"' border='0'>"); document.write("</a>"); //--> </SCRIPT>
- ベストアンサー
- JavaScript
- 1万個からランダムリンクさせるには？
1万個からランダムリンクさせたいのですが、 jmp〔０〕からjmp〔１００００〕まで作ってしまうと 異常にソースが長くなり、読み込みが長くなってしまいました。 軽量化して読み込みを早したいのですが、いい方法はないでしょうか？ 使用したソースです プログラム初心者ですので具体的に書いていただけるとうれしいです。 <HTML> <HEAD> <TITLE></TITLE> </HEAD> <BODY bgcolor="#ffffff"> <SCRIPT language="JavaScript"> <!-- // ランダムに画像を表示する jmp = new Array(); img = new Array(); // ジャンプ先のアドレス(数字は画像と対応) jmp[0] = "http://www.yahoo.co.jp/"; jmp[1] = "http://bb.yahoo.co.jp/"; jmp[2] = "http://www.yahoo.co.jp/"; jmp[3] = "http://auctions.yahoo.co.jp/"; jmp[4] = "http://aeu.jp/cs/"; // 画像のアドレス(数字はジャンプ先のアドレスと対応) img[0] = "img/img0.jpg"; img[1] = "img/img1.jpg"; img[2] = "img/img2.jpg"; img[3] = "img/img3.jpg"; img[4] = "img/img4.jpg"; n = Math.floor(Math.random()*jmp.length); document.write("<a href='"+jmp[n]+"'>"); document.write("<img src='"+img[n]+"' border='0'>"); document.write("</a>"); //--> </SCRIPT> </BODY> </HTML>
- 締切済み
- JavaScript
- JSを用いてサイトを開いた際にランダムでバナー表示する仕組みを作りたい
JSを用いてサイトを開いた際にランダムでバナー表示する仕組みを作りたいと思っているのですが、 2のバナーの時には別窓で開き1のバナーの時はセルフで開くような設定を施す場合は どの用に書けばいいでしょうか？ 一応いろいろと調べて下記までは書いてみたのですが。。。 うまく動きません。。。 どなたか助けていただけませんでしょうか？ よろしくお願いします。 <SCRIPT language="JavaScript"> <!-- // ランダムに画像を表示する jmp = new Array(); img = new Array(); tgt = new Array(); // ジャンプ先のアドレス(数字は画像と対応) jmp[0] = "wwwwwww.com"; jmp[1] = "wwwwwww.com"; // 画像のアドレス(数字はジャンプ先のアドレスと対応) img[0] = "img/01.jpg"; img[1] = "img/01r.jpg"; // ブランクの指定 tgt[0] = "_self"; tgt[1] = "_blank"; n = Math.floor(Math.random()*jmp.length); document.write("<a href='"+jmp[n]+"'>"); document.write("<img src='"+img[n]+"' target='"+tgt[n]+"' border='0'>"); document.write("</a>"); //--> </SCRIPT>
- ベストアンサー
- JavaScript
- それぞれの画像をオンマウスのときに違う画像にしたい
下記【１】の通り、画像のランダムリンクはできたのですが それぞれの画像をオンマウスしたときに 違う画像を表示するにはどうすればよいでしょうか？ JavaScriptを使わずに、一枚の画像だけを変える場合は↓のようにやっておりました <a href="http://～" target="_blank" ><img src="img[0] " height="" width="" border="0" onmouseover="this.src='img[0] の色違い画像など';" onmouseout="this.src='img[0] と同じ、もしくは違う画像';"></a> ※例えばimg[0]をオンマウスしたときにimg[2]にしたいのではなく、 それぞれ個別に用意した画像(通常時、オンマウス時、離した後の画像３枚)にしたいのですが。 【１】 // ランダムに画像を表示する 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>");
- 締切済み
- JavaScript
- target="new"を書き込む場所
私はあるサイトを作成しているのですが、そのサイトのトップページで静止画像をランダムに表示させています。更新ボタンを押すたびに静止画像が変わるというものです。そしてその静止画像をクリックすると、ある特定のホームページにリンクしています。下記はそのソースです。 この静止画像をクリックしても、タブをもう一つ開いてリンクしていません。同じタブで切り替わるだけです。HTMLでしたら、target="new"になっていないということです。そこでお聞きしたいのですが、下記のJavaScriptでtarget="new"にするにはどこにこれを書き込めばいいのでしょうか？ また、サイトを開くたびにランダムに静止画像を表示させるだけでなく、静止画像を数秒ごとに切り替えるソースをご存知の方がいらっしゃいましたら、ぜひご教授ください。よろしくお願いします。 <!--ランダム広告ココから--> <SCRIPT language="JavaScript"> <!-- // ランダムに画像を表示する jmp = new Array(); img = new Array(); // ジャンプ先のアドレス(数字は画像と対応) jmp[0] = "http://www.○○○"; jmp[1] = "http://www.□□□"; // 画像のアドレス(数字はジャンプ先のアドレスと対応) img[0] = "img/○/○420x200.jpg"; img[1] = "img/□/□420x200.jpg"; n = Math.floor(Math.random()*jmp.length); document.write("<a href='"+jmp[n]+"'>"); document.write("<img src='"+img[n]+"' border='0'>"); document.write("</a>"); //--> </SCRIPT> <!--ランダム広告ココまで-->
- ベストアンサー
- JavaScript
- ランダムバナーのリンク先をポップアップウィンドウで開きたい。
ランダムバナーのリンク先をポップアップウィンドウで開きたい。 当方javascript初心者なのですが、色々なサイトを参考にして上記の方法を模索しています。 以下に記載する内容で画像をランダムに表示するところまで出来たのですが、 画像をクリックすると通常通り、リンク先に飛ぶだけでポップアップウィンドウが開きません。 この記述の間違い点、問題点をご指摘、助言をいただきたく思います。 よろしくお願いたします。 以下js記述↓ <SCRIPT language="JavaScript"> <!-- jmp = new Array(); img = new Array(); // ジャンプ先のアドレス(数字は画像と対応) jmp[0] = "http://www.yahoo.co.jp/"; jmp[1] = "http://google.com/"; jmp[2] = "http://www.microsoft.com/"; img[0] = "banner1.jpg"; img[1] = "banner2.jpg"; img[2] = "banner3.jpg"; n = Math.floor(Math.random()*jmp.length); document.write("<a href='"+jmp[n]+"' onClick='javascript:window.open('"+jmp[n]+"','','width=600'); return false;'>"); document.write("<img src='"+img[n]+"' border='0' width='100' height='100' />"); document.write("</a>"); //--> </SCRIPT>
- ベストアンサー
- JavaScript
- 一定時間で画像とリンク先を変換する
DreamWeaverCS3でHPを製作しております、まだ初心者です。 リンクが設定してある画像を一定時間で変換していき、なおかつリンク先のページをポップアップウィンドウで開こうとしています。 下記コードでポップアップウィンドウは開くのですが一定時間での変換がうまくいきません。 どなたかご教授頂けませんでしょうか。 宜しくお願い致します。 <SCRIPT language="JavaScript"> <!-- var interval = 5000; //切り替わる時間（1000=1秒） jmp = new Array(); img = new Array(); // ジャンプ先のアドレス(数字は画像と対応) jmp[0] = "00000.html"; img[0] = "00000.jpg"; jmp[1] = "11111.html"; img[1] = "11111.jpg"; n = Math.floor(Math.random()*jmp.length); document.write("<a href='"+jmp[n]+"' onClick=\"javascript:window.open('"+jmp[n]+"','','width=400,height=380'); return false;\">"); document.write("<img src='"+img[n]+"' border='0' width='300' height='25' />"); document.write("</a>"); setInterval(function(){ //--> </SCRIPT>
- ベストアンサー
- JavaScript
- ランダム表示画像へ説明文を表示したい。
ランダムな画像表示に対しそれぞれへの個別リンク設定をし、 個々の画像にカーソルを重ねた時に説明文を表示するようにしようと思っています。 画像とリンクはうまくいっているのですが説明文が表示されません 記述は下記のようにしました。 間違っているところを訂正していただけないでしょうか、 お願いします。 <script language="JavaScript"> <!-- // ランダムに画像を表示する jmp = new Array(); img = new Array(); // ジャンプ先のアドレス(数字は画像と対応) jmp[0] = "http://www.marucho-powertec.com/contents/powercool.html"; jmp[1] = "http://www.marucho.co.jp/mbs/cnts/option1/?c=seakayak"; // 画像のアドレス(数字はジャンプ先のアドレスと対応) img[0] = "image/k_imgae/index/event/h23powercool.gif","遮熱塗料パワークール"; img[1] = "image/k_imgae/index/event/h23.08.18.jpg","シーカヤックガイドツアー"; n = Math.floor(Math.random()*jmp.length); document.write("<a href='"+jmp[n]+"'>"); document.write("<img src='"+img[n]+"' border='0'>"); document.write("</a>"); //--> </script>
- ベストアンサー
- JavaScript
- 画像がページによって表示されません
http://small-office.net/のサイトの画像の表示で困っています。 ヘッター右上部分に、ジャバスクリプトで更新するたびに切り替わる画像を設置しました。 トップページやhttp://small-office.net/search.htmlのページではうまく画像が表示されるのですが、 http://small-office.net/list/osaka.htmlのページだと画像が表示されません。 階層が違うからなのか…。 JavaScript の知識がなく、JavaScript のソースはwebで調べてコピーして使いました。 下はジャバスクリプトのソースです。 // JavaScript Document <!-- // ランダムに画像を表示する jmp = new Array(); img = new Array(); // ジャンプ先のアドレス(数字は画像と対応) jmp[0] = "http://jishusitu.com/"; jmp[1] = "http://co-work-ing.com/"; jmp[2] = "http://thai-kosiki.net/"; // 画像のアドレス(数字はジャンプ先のアドレスと対応) img[0] = "img/common/bnr-ad-header1.png"; img[1] = "img/common/bnr-ad-header2.png"; img[2] = "img/common/bnr-ad-header3.png"; 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>"); http://small-office.net/list/osaka.htmlでも画像を表示するにはどうしたらいいのでしょうか？ どうぞよろしくお願いします。
- ベストアンサー
- CSS
お礼
とても分かりやすい説明ありがとうございました！ おかげさまで文字化けが直りました～！