Блог

Главная - Вопросы по программированию - Создание выпадающего списка

Создание выпадающего списка

#javascript #jquery #html #dom

#javascript #jquery #HTML #dom

Вопрос:

Я потратил некоторое время, пытаясь найти элегантное и кроссбраузерное решение, но не смог. Я пытаюсь динамически создавать выпадающий список. Вот мой html:

 ...
<span id="currencies">
</span>
...

В моем скрипте я пытаюсь сделать следующее:

  • Создайте элемент выбора
  • Поместите в него, скажем, 4 параметра — ‘AAA’, ‘BBB’, ‘CCC’ и ‘DDD’
  • Добавьте элемент select в $(‘#валюты’)

Я предполагаю, что для того, чтобы код был кроссбраузерным, он должен быть написан с использованием jQuery. Когда я говорю элегантный, я имею в виду, возможно, попытку избежать слишком большой разметки, например, что-то вроде этого:

 // THIS IS NOT A WORKING CODE
$('#currencies').appendSelect().addOption('AAA', 'AAA').addOption('BBB', 'BBB')...

Может быть, у кого-нибудь есть какой-нибудь совет. Спасибо.

Ответ №1:

Я бы, вероятно, сделал это так:

 var $s = $('<select/>').appendTo($('#currencies'));
$.each(['AAA','BBB','CCC','DDD'],function(i,text){
    $s.append($('<option/>',{value:text,html:text}));
});

Комментарии:

1. Энди, спасибо, я думаю, что это очень хороший код. Только один вопрос, почему вы поставили знак доллара перед именем переменной, это похоже на соглашение jQuery или что-то в этом роде?

2. @SBel я бы сказал, что это квази-соглашение. Это помогает быстро отличить jquery от обычных переменных.

Ответ №2:

Вы должны создать строку

var string1='<option>AAA</option><option>BBB</option>.........</option>'

Затем

$('#currencies').html(string1);

сделает работу за вас