Mais conteúdo relacionado
Semelhante a 五行完成網頁多國語系 (20)
五行完成網頁多國語系
- 2. ●
萬華社區大學、救國團 電腦老師
●
曾經出沒地： H4, CloudTW, GTUG
●
目前擔任 H4 值日生
- 10. ●
相依性低
– jquery-1.3.0.min.js 以上
– jquery.i18n.js
●
體積小，載入速度快 - 3.2KB 無壓縮
●
適合各種 framework
●
開發速度快
●
學習曲線低
- 11. JQuery i18n
●
2009 年由 Bryan W Berry 開發
● MIT license
● https://github.com/bryanwb/jquery-i18n/
- 13. <script type='text/javascript' src='./jquery-1.3.2.min.js'></script>
<script type='text/javascript' src='./jquery.i18n.js'></script>
<script type='text/javascript' src='./jquery.ne.json'></script>
<script type='text/javascript' src='example.ne.json'></script>
<script type='text/javascript'>
$(document).ready(function(){
$._.setLocale('ne');
$('#example1').append("<div>" + $._('Welcome')+"</div>");
$('#example1').append("<div>" + $._n(90) + "</div>");
});
</script>
<div id='example1'>Example using strings application-wide <br />
- 15. ●
手動預先加入語系檔
– 就算使用者用不到也要花費流量讀取檔案
●
手動輸入使用者語系
– 可以直接讀取瀏覽器語系設定
●
轉換文字必須放在 <script> 中
– 破壞 HTML 文字可閱讀性
- 21. 撰寫一個 HTML 檔
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
</head>
<body>
<span>Hello</span><span>World</span>
</body>
</html>
- 22. 載入 2 個 javascript 檔案
● jquery-1.8.0.min.js
● jquery.i18n.js
- 27. // 幫 class="gettext" 的元素增加 gettext 屬性
$._.setAnchorByClass( 'gettext' );
// 根據語系設定替換網頁文字
$._.replaceByLocale( "language/hellow
orld." + $._.getLocale() + ".json" );
- 30. $('.change').click( function() {
// 根據按鈕更改語系設定
$._.setLocale( $(this).text() )
// 根據語系設定替換網頁文字
$._.replaceByLocale( "language/helloworld."
+ $._.getLocale() + ".json" );
});
- 36. 1. 討論
web, network, programming,
system, blablah….
2. 交流系統工具 & 使用技巧
3. 八卦
- 41. Amos Tsai
0982-460-210
amos.tsai@gmail.com
