javascript: установить заголовок опции в теге select с помощью javascript

Question

Я работаю над проектом, в котором у меня есть тег select, параметры которого генерируются в функции javascript. В настоящее время я заполняю атрибут title для каждого параметра подробным описанием.
Внутри функции javascript я сейчас делаю что-то вроде этого:

var country = new Option("countryUSA", "United States of America");
$("#mySelect").get(0).options[1]=country;

Это отлично работает, опция появляется. Тем не менее, мне также нужно установить атрибут «заголовок» этого HTML-элемента опции. Я пробовал что-то вроде этого:

country.title="Full description of USA";

но это не работает.
Я знаю, что могу сделать что-то вроде этого:

 $("#mySelect").get(0).options[1].title="My title";

но я пытался установить заголовок перед добавлением опции в тег выбора. Разве объект «Option» не позволяет мне устанавливать свойство «title»? Функция javascript даже не выполняется. Разве я не могу установить атрибут «title» для html-элемента «option» в javascript?

Answer 1

Похоже, вы используете jQuery. Существует гораздо более простой способ сделать то, что вы хотите. Просто используйте jQuery API , а не возвращайтесь обратно к vanilla DOM:

$('<option>',
{
    value: 'countryUSA',
    title: 'Full description of USA',
    text: 'United States of America'
}).appendTo("#mySelect");

Тем не менее, вы ожидаете, что установив title для отображения всплывающей подсказки браузера при наведении курсора на <option>? По крайней мере, в Chrome такая подсказка не появится.

Попробуйте сами: http://jsfiddle.net/GMTLn/1/

---

Редактировать Chrome и Safari не показывают всплывающую подсказку на <option> с атрибутом title, потому что WebKit не показывает. См. этот отчет об ошибке .

Answer 2

Вы можете установить атрибут заголовка

   $('#mySelect').append(
   $("<option/>", { text: value }).attr("title",value)); 

Вот рабочий пример http://jsbin.com/ozudoTod/1/

Или вот так:

     value = cleanNulls( value );
     var option = $( '<option/>', {
     title: value,
     text: value
     });
     $('#mySelect').append( option );