私たちはオンラインストアの国際版を作成しています。私はすべてのJavaScriptエラーメッセージを解凍しているので、そのサイトの関連する言語で表示されています。JavaScriptの複数言語のエラーメッセージ
私は明らかにすべてのサイトのjavascriptの同じセットを保つだけですが、ドイツ語/フランス語/イタリア語のテキストファイルからの一連のエラーメッセージをロードします。私はこれがプレーンテキストのエラーメッセージのセットを保持している別々のjsonファイルで行うことが可能かもしれないと考えました。
誰もがこの問題の最も簡単でスケーラブルな解決策を提案できますか？ありがとう。あなたがnavigator.language に分岐、粗に限定されている純粋なJSで
私が代わりに行うために、それはあなたが持っている「シームレス」
一つの選択肢は、JavaScript言語ファイルを作成することですAccept-Languageに基づいて、適切なバリアントを提供するために、httpdの設定することをお勧めしますあなたのJavascriptファイルの直前に右のものを含めてください。サーバー側では、選択した言語がわかりますので、適切なファイルを簡単に含めることができます。言語ファイルでは、コードで使用できる変数を定義します。以下のような
何か：
<script type="text/javascript" src="lang_en.js" />
<script type="text/javascript" src="yourjavascript.js" />
lang_en.jsがlang_de.jsか何かのいずれかになります、サーバが決定します。あなたが何か持っている言語ファイルで
（簡略化され、グローバルなものを、単にアイデアを表示する）：
var lang = {
ARE_YOU_SURE : 'Are you sure?',
...
};
そして、あなたのメインのJavaScriptでファイルあなたは、単に行うことができます。
alert(lang.ARE_YOU_SURE);
Simplesソリューション！私はそれが好きです、それは私のコードに最適です。唯一の違いは、jsの代わりにjsonファイルを使用したことです。 – rodrigorf
私は、メッセージを取得し、自分自身の変数を渡す方法に関する私の問題を解決しています。ここで私が構築している簡単なテストページにコードです：
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<script type="text/javascript" src="http://media.topshop.com/javascript/wearwiths/lib/jquery/jquery.js"></script>
<script type="text/javascript" src="brand.js"></script>
<script type="text/javascript">
var msg, xVal = 2, yVal = 8, prodName = "Blue Skirt", msg_type = "information", lang = "eng";
$.ajax({
url: lang + '_messages.js',
dataType: 'script',
scriptCharset: 'utf-8',
success: function() {
console.log("The " + lang + " language file was loaded.");
msg = messages || {};
}
});
function translate(message, details) {
if(message.indexOf("{currency}") != -1) {
message = message.replace("{currency}", Arcadia.Brand.currency);
console.log(typeof Arcadia.Brand.currency);
}
if(message.indexOf("{val}") == -1) {
return message;
} else {
for (var i = 0; i < details.length; i++) {
message = message.replace("{val}", details[i]);
}
return message;
}
}
$(document).ready(function() {
var listItem, listIndex;
$('#item_list li a').click(function() {
listItem = $(this).parent();
listIndex = $('ul#item_list li').index(listItem);
toString(listIndex);
switch (msg_type) {
case "information":
$("p#error").text(translate(msg.information["mes_" + listIndex], [xVal, "14"]));
console.log(translate(msg.information["mes_" + listIndex], [xVal, "14"]));
break;
case "product_or_bundle":
$("p#error").text(translate(msg.product_or_bundle["mes_" + listIndex], [xVal, "14"]));
console.log(translate(msg.product_or_bundle["mes_" + listIndex], [xVal, "14"]));
break;
case "error":
$("p#error").text(translate(msg.error["mes_" + listIndex], [xVal, "14"]));
console.log(translate(msg.error["mes_" + listIndex], [xVal, "14"]));
break;
case "code":
$("p#error").text(translate(msg.code["mes_" + listIndex], [xVal, "14"]));
console.log(translate(msg.code["mes_" + listIndex], [xVal, "14"]));
break;
}
return false;
});
$('ul#message_select li a').click(function() {
msg_type = $(this).attr('href');
msg_type = msg_type.replace('#', "");
});
$('select#lang').change(function() {
lang = $(this).val();
$.ajax({
url: lang + '_messages.js',
contentType: "application/x-www-form-urlencoded; charset=utf-8",
dataType: 'script',
success: function() {
console.log("The " + lang + " language file was loaded.");
msg = messages || {};
}
});
});
});
</script>
<style type="text/css">
p {
background: green;
color: #fff;
}
p span {
background: darkblue;
}
em {
font-weight: bold;
font-style: normal;
color: yellow;
}
</style>
</head>
<body>
<h1>V7 site messaging test</h1>
<h2>Select message language</h2>
<form>
<select id="lang">
<option value="eng" title="Switch the language to English">English</option>
<option value="fra" title="Switch the language to French">French</option>
<option value="ger" title="Switch the language to German">German</option>
</select>
</form>
<h2>Select message type</h2>
<ul id="message_select">
<li><a href="#information" title="Information">Information</a></li>
<li><a href="#product_or_bundle" title="Product or Bundle">Product or Bundle</a></li>
<li><a href="#error" title="Error">Error</a></li>
<li><a href="#code" title="Code">Code</a></li>
</ul>
<h3>Message</h3>
<ul id="item_list">
<li><a href="#" title="list item 1">list item 1</a></li>
<li><a href="#">list item 2</a></li>
<li><a href="#">list item 3</a></li>
<li><a href="#">list item 4</a></li>
<li><a href="#">list item 5</a></li>
<li><a href="#">list item 6</a></li>
<li><a href="#">list item 7</a></li>
<li><a href="#">list item 8</a></li>
<li><a href="#">list item 9</a></li>
<li><a href="#">list item 10</a></li>
<li><a href="#">list item 11</a></li>
<li><a href="#">list item 12</a></li>
<li><a href="#">list item 13</a></li>
<li><a href="#">list item 14</a></li>
<li><a href="#">list item 15</a></li>
<li><a href="#">list item 16</a></li>
<li><a href="#">list item 17</a></li>
<li><a href="#">list item 18</a></li>
<li><a href="#">list item 19</a></li>
<li><a href="#">list item 20</a></li>
<li><a href="#">list item 21</a></li>
<li><a href="#">list item 22</a></li>
</ul>
<p id="error">Error Message will appear here</p>
</body>
</html>
私は今が午前問題は、フランス語とドイツ語のための外国laguage文字はナンセンスとして出てきているということです。これは、文字セットと関係があるが、私はutf-8 charsetを使用して指定されたjsメッセージファイルに対して、htmlおよびajax呼び出しで文字セットをutf-8に設定しています。どのようにこれを克服するためのアイデア？
var messages = {
"information": {
"mes_0": "this link will open in a new browser window",
"mes_1": "This link will open in a new browser window",
"mes_2": "Rollover image from left to right to rotate",
"mes_3": "Loading tweets...",
"mes_4": "Latest Tweets",
"mes_5": "Click to view photo {val}",
"mes_6": "Click to view 360",
"mes_7": "Click to view video",
"mes_8": "Click to view photo",
"mes_9": "out of stock",
"mes_10": "low stock",
"mes_11": "click on a size below",
"mes_12": "Sorry, this item is out of stock.",
"mes_13": "Select Size: ",
"mes_14": "Please wait",
"mes_15": "Continue shopping",
"mes_16": "{val} item(s) added to bag",
"mes_17": "Size {val}",
"mes_18": "{val} item(s) in your bag Subtotal: {currency}{val}",
"mes_19": "s",
"mes_20": "item",
"mes_21": "You need to select a size before you can add this item to your bag."
},
"product_or_bundle": {
"mes_0": "Rollover image to zoom.",
"mes_1": "View large image",
"mes_2": "Photo {val} of prod name",
"mes_3": "Scroll up",
"mes_4": "Scroll down",
"mes_5": "View details of {val}",
"mes_6": "Remove this item",
"mes_7": "Remove",
"mes_8": "Scroll left",
"mes_9": "Scroll right",
"mes_10": "Check Availability In Store:",
"mes_11": "Outfit added to bag",
"mes_12": "Click to view full details of this item"
},
"error": {
"mes_0": "Sorry, an error occurred when trying to add your item. Please try again.",
"mes_1": "Sorry, an error occurred when trying to add your items. Please try again.",
"mes_2": "You need to select a size for each item before you can add the outfit to your bag."
},
"code": {
"mes_0": "[View your bag] [Go to checkout] continue shopping button",
"mes_1": "[View your bag] [Go to checkout]"
}
}
、ここでファイルと呼ばれるger_messages.jsでドイツ語のメッセージです：：ちょうどここに完全酒のため
は、ファイルeng_messages.jsの私の英語laguageメッセージがある
var messages = {
"information": {
"mes_0": "Dieser Link wird in einem neuen Fenster öffnen",
"mes_1": "Dieser Link wird in einem neuen Browser-Fenster geöffnet",
"mes_2": "Rollover-Bild von links nach rechts zu drehen",
"mes_3": "Loading tweets...",
"mes_4": "Aktuelle Tweets",
"mes_5": "Klicken Sie auf ein Foto, Blick {val}",
"mes_6": "Klicken Sie auf 360 Ansicht",
"mes_7": "Klicken Sie, um Video anzusehen",
"mes_8": "Klicken Sie auf ein Foto, Blick",
"mes_9": "ausverkauft",
"mes_10": "Wenige Exemplare auf Lager",
"mes_11": "Klicken Sie auf eine Größe unterhalb",
"mes_12": "Leider ist der Artikel nicht auf Lager.",
"mes_13": "Wählen Sie Größe:",
"mes_14": "Bitte warten",
"mes_15": "Einkauf fortsetzen",
"mes_16": "{val} Artikel hinzugefügt Tasche",
"mes_17": "Größe {val}",
"mes_18": "{val} Artikel hinzugefügt Tasche Zwischensumme: £{val}",
"mes_19": "s",
"mes_20": "artikel",
"mes_21": "Sie müssen eine Größe auswählen, bevor Sie diesen Artikel in Ihre Tasche hinzufügen können."
},
"product_or_bundle": {
"mes_0": "Rollover-Bild zu vergrößern.",
"mes_1": "Bild vergrößern",
"mes_2": "Foto {val} von {val}",
"mes_3": "Blättern Sie nach oben",
"mes_4": "Blättern Sie nach unten",
"mes_5": "Detailansicht der {val}",
"mes_6": "Diesen Artikel entfernen",
"mes_7": "Entfernen",
"mes_8": "Blättern Sie nach links",
"mes_9": "Blättern Sie nach rechts",
"mes_10": "Überprüfen Sie die Verfügbarkeit im Shop:",
"mes_11": "Outfit hinzugefügt Tasche",
"mes_12": "Hier klicken vollständigen Details zu diesem Element anzuzeigen"
},
"error": {
"mes_0": "Leider trat ein Fehler beim Versuch, Ihren Artikel hinzuzufügen. Bitte versuchen Sie es erneut.",
"mes_1": "Leider trat ein Fehler beim Versuch, Ihre Elemente hinzuzufügen. Bitte versuchen Sie es erneut.",
"mes_2": "Sie müssen eine Größe für jeden Artikel, bevor Sie das Outfit, Ihre Tasche hinzufügen möchten."
},
"code": {
"mes_0": "[Sehen Sie Ihre Tasche] [Zur Kasse]-Taste weiter einkaufen",
"mes_1": "[Sehen Sie Ihre Tasche] [Zur Kasse]"
}
}
@Paulあなたがこれらのタグを主張しようとしている場合、それらが実際に関連する基準に関する質問をしていることを確認する方法はありますか？ – Charles