[他言語ページに飛ぶリンクのためのJapaScriptのコードをお示しください]


私のウェブサイトは多言語です。

日本語のファイル: *_ja
英語語のファイル: *_en
フランス語のファイル: *_fr
のように、ファイル名に、"ISO 639-1" に従った言語コードを附加しています。

さて、テンプレート上に、言語別の国旗があり、国旗をクリックすると、自動的に、そのファイルの別の言語に飛ぶようにしたいです。実装にはJavaScriptを使うのが一番よいのかなと思います。

まとめますと、
ユーザが

http://example.com/index_ja.html を閲覧しているときにイギリス国旗をクリックすと、

http://example.com/index_en.html に飛ばす。
もし、フランス国旗をクリックすると、

http://example.com/index_fr.html に飛ばす。

という動作です。

要するに、国旗をクリックすると、現在閲覧中のファイル名の最後3文字を削除して、そこに国旗に応じた言語コードを差し替えて、そのページに飛ばす、というものです。

つきましては、上記のような動作をするJavaScriptの具体的なコードを、ご教示願います。

回答の条件
  • 1人2回まで
  • 13歳以上
  • 登録:2010/02/21 15:16:44
  • 終了:2010/02/28 15:20:02

回答(3件)

id:km1967 No.1

km1967回答回数541ベストアンサー獲得回数402010/02/21 15:27:23

以下のようにHTMLだけでできるのだが、どこをJavaScriptにしたいのか?

<a href="index_en.html"><img src="イギリス国旗画像" /></a>
<a href="index_fr.html"><img src="フランス国旗画像" /></a>
<a href="index_jp.html"><img src="日本国旗画像" /></a>
 :
id:webproduct

そんなはずないでしょう。

国旗はテンプレート上にあるので、リンク先をべた打ちで指定することはできません。

2010/02/21 17:47:12
id:ofk No.2

ofk回答回数12ベストアンサー獲得回数32010/02/21 20:16:38

ポイント40pt

国旗ファイルの名前は「ja.gif」等とします。

<div id="lang_link"></div>
var elem = document.getElementById("lang_link"),
    lang = ["ja", "en", "fr"];
for (var i = 0; i < lang.length; ++i) {
    var link = elem.appendChild(document.createElement("a"));
    link.href = location.href.replace(/_\w+?\./, "_" + lang[i] + ".");
    link.appendChild(document.createElement("img")).src = lang[i] + ".gif";
}

もしくはリンク先を

<a href="javascript:lang_link('ja')"><img src="日本の国旗"></a>

等と指定し、

function lang_link(lang) {
    location.href = location.href.replace(/_\w+?\./, "_" + lang + ".");
}

とすれば良いと思います。

id:makog No.3

makog回答回数2ベストアンサー獲得回数02010/02/22 01:09:04

ポイント40pt

<head></head>内(あるいは.jsファイルに)以下のように関数を定義して、

function change_lang( lang ) {
    location.href = location.href.replace( /_[a-z][a-z]\.html$/, '_' + lang + '.html' );
    return false; 
}

例えば、フランス国旗には以下のようにリンクする

<a href="/index_fr.html" onclick="return change_lang('fr');"><img src="/img/flag_fr.gif" /></a>

というのはいかがでしょうか。こうしておけば、JavaScript が OFF の人はフランス語のトップに飛び、ONの人は現在見ているページのフランス語版に飛びます。

id:webproduct

んー、多分違うと思います。

ファイル名は、index_*.html に限らないんですよ。

company_*.html かもしれないし、

address_*.html かもしれないし、

いといろあるのです。

テンプレートの国旗部分に記述できるのは、

「このページのその言語版に飛ぶ、その言語版のファイル名は、同じディレクトリで、最後の3文字が_*になっている」ということです。

2010/02/22 15:19:59
  • id:km1967
    >さて、テンプレート上に、言語別の国旗があり
    何のテンプレートを意味しているの?
    質問の仕方が悪いと思うよ
  • id:rouge_2008
    JavaScriptに詳しくないので断言は出来ませんが、JavaScriptだけで実装するのは無理な可能性もあります。

    以下の事を実現したいのですよね?
    ・言語別のページに「index.html」「info.html」等、ファイル名から言語別コードである最後3文字を削除したファイル名でアクセスさせたい
    ※実存するのは言語別の「index_ja.html」「index_en.html」「info_ja.html」「info_en.html」等

    テンプレートや作成したページのHTMLを書き換えるのは問題ないですか?
    それも出来ないとちょっと難しいですが・・・

    他にCookieと.htaccessを利用すると可能なのですが、回答しても構わないでしょうか?
    ※言語を切り替えてもすぐには切り替わらないので、更新ボタンを設置します。(ページを移動した場合も切り替わっています。)
  • id:rouge_2008
    現在、テンプレートで言語切り替え用の画像表示とリンクのコードはどのように記述されていますか?
    回答するのに必要ですので、参考までにお知らせください。
  • id:makog
    えぇっと、index_*.html に限らず、company_*.html でも address_*.html でも大丈夫なようにしたつもりなのですが・・・。index と書いているのは、JavaScript OFF の人の救済策でして・・・。

この質問への反応(ブックマークコメント)

「あの人に答えてほしい」「この質問はあの人が答えられそう」というときに、回答リクエストを送ってみてましょう。

これ以上回答リクエストを送信することはできません。制限について

絞り込み :
はてなココの「ともだち」を表示します。
回答リクエストを送信したユーザーはいません