jquery-i18next
Version:
i18next plugin for jquery usage
55 lines (47 loc) • 1.75 kB
HTML
<html>
<head>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.js" ></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/i18next/8.1.0/i18next.min.js" ></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-i18next/1.2.0/jquery-i18next.min.js" ></script>
<!-- <script src="/jquery-i18next.min.js" ></script> -->
</head>
<body>
<ul class="nav">
<li><a href="#" data-i18n="nav.home"></a></li>
<li><a href="#" data-i18n="nav.page1"></a></li>
<li><a href="#" data-i18n="nav.page2"></a></li>
</ul>
<div class="content">
<input data-i18n="[placeholder]input.placeholder; [title]input.placeholder" />
</div>
<script>
// use plugins and options as needed, for options, detail see
// http://i18next.com/docs/
i18next.init({
lng: 'en', // evtl. use language-detector https://github.com/i18next/i18next-browser-languageDetector
resources: { // evtl. load via xhr https://github.com/i18next/i18next-xhr-backend
en: {
translation: {
input: {
placeholder: "a placeholder"
},
nav: {
home: 'Home',
page1: 'Page One',
page2: 'Page Two'
}
}
}
}
}, function(err, t) {
// for options see
// https://github.com/i18next/jquery-i18next#initialize-the-plugin
jqueryI18next.init(i18next, $);
// start localizing, details:
// https://github.com/i18next/jquery-i18next#usage-of-selector-function
$('.nav').localize();
$('.content').localize();
});
</script>
</body>
</html>