Using i18next,如何翻译 JQuery Mobile 小部件?具体来说,我想知道如何在不诉诸使用的情况下做到这一点data-i18n-target
修改生成的内部元素,因为这很脆弱,因为未来的小部件版本可能会更改生成的代码。
是否有我可以订阅的特定页面生命周期事件,以便能够在小部件转换发生之前让 i18next 修改 DOM?
在此示例中(请参阅jsfiddle),一些标记被正确翻译,但是homeBtn
and submitBtn
不是:
HTML:
<div id="home_page" data-role="page">
<div data-role="header">
<a id="homeBtn" href="/" data-icon="home" data-i18n>app.home</a>
<h2 data-i18n>app.title</h2>
</div>
<div data-role="content">
<div data-role="fieldcontain">
<label for="textinput1" data-i18n>app.label</label>
<input type="text" name="textinput1" id="textinput1" value=""></input>
</div>
<form action="">
<input id="submitBtn" type="submit" data-i18n="[value]app.button" />
</form>
</div>
<div data-role="footer">
<center>
<p data-i18n>app.footer</p>
</center>
</div>
</div>
JavaScript:
var i18nOpts = {
resStore: {
dev: {
translation: {
app: {
button: 'Button',
home: 'Home',
label: 'Label',
footer: 'Footer',
title: 'i18n Test'
}
}
},
}
};
i18n.init(i18nOpts).done(function() {
$("html").i18n();
});
jQuery Mobile 小部件在两个事件上自动初始化(标记增强),pagebeforecreate
and pagecreate
。大多数小部件都会初始化一次pagecreate
occurs.
你所需要的只是包裹i18n代码在pagebeforecreate
.
$(document).on("pagebeforecreate", function () {
// code
});
Demo
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)