这是我想从中学习的文档中的代码。 在我看来,当更改事件被触发时,隐藏第二个选择并显示它会很酷。我尝试了一些函数注入(inject)但没有好的结果。谁能给这个问题2美分吗?
(function($) {
var cities = {
'UK': ['London', 'Manchester', 'Brighton', 'Bristol'],
'USA': ['Washington DC', 'Los Angeles', 'Austin', 'New York']
};
//The form
var form1 = new Backbone.Form({
schema: {
country: { type: 'Select', options: ['UK', 'USA'] },
city: { type: 'Select', options: cities.UK },
message: { type: 'Text'}
}
}).render();
form1.on('country:change', function(form1, countryEditor) {
var country = countryEditor.getValue(),
newOptions = cities[country];
form1.fields.city.editor.setOptions(newOptions);
});
//Add it to the page
$('body').append(form1.el);
})(jQuery);
最佳答案
form1.fields['message'].$el.hide();
渲染后
form1.fields['message'].$el.toggle(); on Change 函数内部解决了这个问题。
(function($) {
var cities = {
'UK': ['London', 'Manchester', 'Brighton', 'Bristol'],
'USA': ['Washington DC', 'Los Angeles', 'Austin', 'New York']
};
//The form
var form1 = new Backbone.Form({
schema: {
country: { type: 'Select', options: ['UK', 'USA'] },
city: { type: 'Select', options: cities.UK },
message: {
//fieldAttrs: { style: 'width: 400px; height:300px;' },
type: 'TextArea',
fieldClass: 'message-input',
validators: [ 'required', /.{20,}/ ]
}
}
}).render();
**form1.fields['message'].$el.hide();**
*form1.on('country:change',* function(form1, countryEditor) {
var country = countryEditor.getValue(),
newOptions = cities[country];
form1.fields.city.editor.setOptions(newOptions);
**form1.fields['message'].$el.toggle();**
});
//Add it to the page
$('body').append(form1.el);
})(jQuery);
关于javascript - Backbone 形式。 js 文档示例 : Onchange Populator: How can i hide the second select and show it after the change event?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/14589352/