- Internationalization and localization
- I18N (internationalization) , L10N (localization) , M17N (multilingualization)
jquery i18n 라이브러리
https://github.com/wikimedia/jquery.i18n
//================
* 언어 번역 자료 파일 설정
'i18n/jq_ko.json'
{
"num_1": "일",
"num_2": "이"
}
'i18n/jq_en.json'
{
"num_1": "One",
"num_2": "Two"
}
//================
* 언어 설정
<html lang="ko">
또는
$.i18n().locale = "ko";
//================
* 스크립트 로드
<script src="i18n/jquery.i18n.js"></script>
<script src="i18n/jquery.i18n.messagestore.js"></script>
//================
* 설정 로드
$(document).ready(function() {
//i18n로드
$.i18n().load( {
'ko': 'i18n/jq_ko.json',
'en': 'i18n/jq_en.json'
});
//================
* 다국어 출력
$.i18n('num_1');
//=================================
* 기본 언어를 한국어로 변경하기
- 별도로 ko.json 파일을 작성하지 않고 사용하기
- 예) $.i18n('옵션')
- locale = 'ko'인 경우 '옵션' 출력
- locale = 'en'인 경우 en.json 파일에서 '옵션' 해당 항목 출력
//============
- en.json 파일 예제
{
"옵션": "Option",
...
}
//====================
- jquery.i18n.js 수정 (v1.0.5)
- fallbacklocale을 en이 아닌 다른 언어로 전환가능하게 수정하기
- 67줄
https://github.com/wikimedia/jquery.i18n/commit/d9f2b57a9a23573394010c4426d0c64f93eaed4b
//if ( locale === 'en' ) {
if ( locale === this.options.fallbackLocale ) {
- 285줄 수정
fallbackLocale: 'ko', // 'en'
//============================
예제
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="utf-8">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.js"></script>
<script src="i18n/jquery.i18n.js"></script>
<script src="i18n/jquery.i18n.messagestore.js"></script>
</head>
<body>
<p>Click Me</p>
<script>
$(document).ready(function() {
//i18n로드
$.i18n().load( {
'ko': 'i18n/jq_ko.json',
'en': 'i18n/jq_en.json'
});
//디버깅 설정
$.i18n.debug = true;
//언어 설정 변경
$.i18n().locale = "en";
$("p").click(function(){
//출력
$(this).text( $.i18n('num_1') );
});
})
</script>
</body>
</html>
//======================
//참고
https://phraseapp.com/blog/posts/jquery-i18n-the-advanced-guide/
'Code > JavaScript' 카테고리의 다른 글
| [jQuery] Ajax (0) | 2018.12.14 |
|---|---|
| [JavaScript] Ajax 예제 (0) | 2018.12.14 |
| [W3School] jQuery 정리 (0) | 2018.11.07 |
| [W3Schools] JavaScript 정리 (0) | 2018.11.07 |
| 자바스크립트 모듈 시스템 (0) | 2018.10.26 |
