Вы можете попробовать использовать выходной параметр. http://msdn.microsoft.com/en-us/library/ms378108.aspx
Что-то вроде:
function populate(selector) {
$(selector)
.append('<option value="foo">foo</option>')
.append('<option value="bar">bar</option>')
}
populate('#myform .myselect');
Или даже:
$.fn.populate = function() {
$(this)
.append('<option value="foo">foo</option>')
.append('<option value="bar">bar</option>')
}
$('#myform .myselect').populate();
А как насчет
var option = $('<option/>');
option.attr({ 'value': 'myValue' }).text('myText');
$('#county').append(option);
Это сбивает с толку. Когда вы говорите «объект формы», вы имеете в виду «
элемент»? В противном случае ваш код не будет работать, поэтому я предполагаю, что ваша переменная формы
на самом деле является ссылкой на элемент
. Почему вы хотите переписать этот код? То, что у вас работает, работает во всех браузерах со сценариями примерно с 1996 года и в ближайшее время не перестанет работать. Выполнение этого с помощью jQuery немедленно сделает ваш код медленнее, более подверженным ошибкам и менее совместимым в разных браузерах.
Вот функция, которая использует ваш текущий код в качестве отправной точки и заполняет элемент
из объекта:
<select id="mySelect"></select>
<script type="text/javascript>
function populateSelect(select, optionsData) {
var options = select.options, o, selected;
options.length = 0;
for (var i = 0, len = optionsData.length; i < len; ++i) {
o = optionsData[i];
selected = !!o.selected;
options[i] = new Option(o.text, o.value, selected, selected);
}
}
var optionsData = [
{
text: "Select a city / town in Sweden",
value: ""
},
{
text: "Melbourne",
value: "Melbourne",
selected: true
}
];
populateSelect(document.getElementById("mySelect"), optionsData);
</script>
Как насчет
$('#county').append(
$('<option />')
.text('Select a city / town in Sweden')
.val(''),
$('<option />')
.text('Melbourne')
.val('Melbourne')
);