jQueryのブラウザの言語検出

Question

私はブラウザが使用している言語を検出し、その言語に関連する適切なクラス要素を表示するページ（クライアント側のみ）を作成する必要性、および皮革にいるシナリオ

他人。

英語がデフォルト言語になります。したがって、配列内のどのセルも一致しない場合、これが表示されます。

ブラウザで現在使用されている言語を検出するのに、navigator.languageとnavigator.userLanguage（IE）の値を使用しています。

私は現在進行中のコードをいくつか持っていますが、可能性のあるすべての可能性を組み込んで配列を使用して選択する最良の方法は不明です。

複数の言語が国に結ばれている可能性もあります。英語の例としてen-us、en-ukなどがあります。これをどうやって結びつけるのですか？

コード

HTML

<ul class="text"> 
    <li class="en active">English: Some text in english</li> 
    <li class="fr">French: Some text in french</li> 
    <li class="de">German: Some text in german</li> 
    <li class="it">Italian: Some text in italian</li> 
    <li class="ja">Japanese: Some text in japanese</li> 
    <li class="es">Spanish: Some text in spanish</li> 
</ul> 

JS（WIP）

var userLang = navigator.language || navigator.userLanguage, 
    countries = ['fr', 'de', 'it', 'ja', 'es'], 
    languagues = ['fr', 'de', 'it', 'ja', 'es']; 

if (userLang === "fr") { 
    $('li').removeClass('active'); 
    $('.fr').addClass('active'); 
} 

例

Fiddle

ありがとうございました。

---

UPDATE

私のために働いた完全なソリューションを提供するために、最終的に将来のユーザーを支援するために、私は上からHTMLの同じレイアウトを使用してputvande's jQuery solutionとそれを組み合わせます。

Here is a working example。

注：このエフェクトは、ブラウザで選択された言語によって変更をトリガーします。 Google Chromeでこれを行う方法の一例としては：設定に

• ゴー - まで>
• スクロールをクリックし、「表示設定を高度...」 - >
• クリックして「言語と入力設定... " - >
• 言語を選択し、[完了]をクリックしてブラウザを再起動します。

これが役立ちます。

Answer 1

次の2つにnavigator.languageを分割し、最初のパラメータだけ（言語）を使用し、そのクラスを持っているliを選択するためにそれを使用することができます

var userLang = navigator.language || navigator.userLanguage; 

// Check if the li for the browsers language is available 
// and set active if it is available 
if($('.' + userLang.split('-')[0]).length) { 
    $('li').removeClass('active'); 
    $('.' + userLang.split('-')[0]).addClass('active'); 
} 

それとももliを変更しようとしています国（例えば、米国と英国の英語）によると？