注意:如果您认为这篇文章应该有更好的标题,请告诉我/编辑它!
我正在尝试国际化我创建的ExtJS表单。我在一个文件中有我的表单的javascript和另一个javascript文件中的翻译,如下所示:
english.js
function get_i18n(){
var i18n = {
Apply : 'Apply For Scholarship',
Student_Information : 'Student Information',
First_Name : 'First Name',
Last_Name : 'Last Name',
Gender : 'Gender',
Male : 'Male',
Female : 'Female',
}
return i18n;
}
然后在我的form.js
function getLang(){
// decode language passed in url
var locale = window.location.search
? Ext.urlDecode(window.location.search.substring(1))
: '';
return locale['lang'];
}//end getLang()
var form;
var lang = getLang();
var languageFile;
if (lang == 'chn'){
languageFile = "chinese.js";
}
else if (lang == 'eng'){
languageFile = "english.js";
}
else if (lang == 'tib'){
languageFile = "tibetan.js";
}
function getLabels(file){
var a = $.getScript(file, function(){
var b = get_i18n();
return b;
});
return a;
}//end getLabels()
var i18n = getLabels(languageFile);
Ext.onReady(function(){
Ext.QuickTips.init();
form = new Ext.form.FormPanel({
id: 'scholarshipForm',
labelWidth: 200, // label settings here cascade unless overridden
url:'scholarshipSubmit.php',
method: 'POST',
frame:true,
layout: 'form',
title: 'Apply For Scholarship',
bodyStyle:'padding:10px 10px 0',
width: 610,
itemCls: 'formStyle',
items: [{
xtype:'fieldset',
checkboxToggle:false,
title: 'Student Information',
autoHeight:true,
layout: 'form',
defaults: {width: 210},
collapsed: false,
items :[{
xtype: 'textfield',
fieldLabel: i18n['First_Name'], //RIGHT HERE I TRY TO USE THE RESULTS
allowBlank:false,
name: 'first',
maskRe: /([a-zA-Z\s]+)$/,
msgTarget: 'side'
}
...
...
...
form.render(document.body);
});
稍微使用代码我知道我的问题可能与我处理异步jQuery $ .getScript的方式有关。奇怪的是,当我没有尝试从url get变量获取语言而是通过将文件名直接提供给其中的$ .getScript来运行我的getLabels函数时,我得到了所需的结果并显示了我的表单的标签因此。我真的很感激任何帮助。我仍然是异步调用的新手,他们总是让我陷入困境: - /。我认为在另一个函数中使用$ .getScript并且像这样冒泡返回会解决问题,也许就是这样,就像我之前提到的那样它工作正常,直到我添加了基于url $ _GET获取文件名的逻辑
感谢您的时间,
elshae
修改
现在我有一个english.json
{i18n: {
"Apply" : 'Apply For Scholarship',
"Student_Information" : 'Student Information',
"First_Name" : 'First Name',
"Last_Name" : 'Last Name',
"Gender" : 'Gender',
"Male" : 'Male',
"Female" : 'Female'
}
}
我正在尝试这样做:
var i18n = {};
function getLabels(file){
$.getJSON(file, i18n, function(data) { i18n = data.i18n; return i18n;});
return true;
}
getLabels(languageFile);
我需要从该回调函数中获取一个i18n对象,我可以这样使用:
i18n.First_Name
等
答案 0 :(得分:1)
您无法从回调处理程序返回值。好吧,如果你愿意,你可以,但它没有任何好处。
相反,最简单的方法就是重新排列代码,以便在<。em>之后 <。em>(.getScript()“完成后需要做的所有事情就是在内部< / strong>回调函数。
所以,比如:
function getLabels(file){
$.getScript(file, function(){
var i18n = get_i18n();
Ext.onReady(function() {
// all that stuff
});
});
}//end getLabels()
我根本不知道Ext.js,所以我不确定“onReady”调用是否正确。关键是在“.getScript()”回调中,您可以可靠地使用您提取的脚本中的代码。
答案 1 :(得分:1)
也许不是将您的语言代码放在javascript函数中,为什么不将它放入JSON格式的文件中,这样可以让您使用jQuery函数将JSON加载到适当的对象中,而您的代码可以使用它来代替
答案 2 :(得分:1)
Ajax是异步的,这意味着您无法从回调函数返回值。
但是,您可以提供另一个回调函数作为参数。然后将以所需数据作为参数执行该回调。
var i18n = {};
function getLabels(file, callback){
$.getJSON(file, i18n, function(data) {
i18n = data.i18n;
callback(i18n);
});
return true;
}
getLabels(languageFile, function(i18n) {
// do something with the data
});