Как добавить атрибут к каждому варианту списка

Question

У меня есть выпадающий список:

<select> 
    <option value=""></option> 
    <option value="Bla">Bla</option> 
    <option value="Foo">Foo</option> 
</select>   

Использование JQuery Я хочу изменить свой список, перечисляя каждый параметр путем добавления пользовательских атрибутов level так мой выбор будет выглядеть что и необходимо пропустить первый вариант списка:

<select> 
    <option value=""></option> //skipping the first one 
    <option value="Bla" level="1">Bla</option> 
    <option value="Foo" level="2">Foo</option> 
</select> 

Как я могу это сделать с помощью jQuery?

Answer 1

Вы можете перебрать все опции с индексом 1 до п, используя $('select option:gt(0)'):

$('select option:gt(0)').attr('level',function(i){ 
    return i+1; 
}); 

Working Demo

или

$('select option:gt(0)').each(function(i){ 
    $(this).attr('level',i+1) 
}); 

Working Demo

Answer 2

$('select').children('option').each(function(index, element) { 
    if (index) $(element).attr('level', index); 
}); 

Answer 3

Вы можете использовать .attr()

$('select option:not(:first-child)').attr('level', function (i) { 
    return i + 1 
}) 

Answer 4

его лучше использовать data-* атрибут предоставленный html5:

$('select option').filter(':not(:first)').attr('data-level', function(i) { 
 
    return $(this).index(); 
 
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 

 
<select> 
 
    <option value=""></option> <!--this has index = 0--> 
 
    <option value="Bla">Bla</option><!--this has index = 1--> 
 
    <option value="Foo">Foo</option><!--this has index = 2--> 
 
</select>

Как вы можете видеть в Js со de есть использование метода jQuery attr(), и вы можете заметить, что он принимает функцию обратного вызова, чтобы вернуть значение атрибута при некоторой операции, если это необходимо.
В этом конкретном случае мы используем .index()option, доступный в заданном select, а в обратном вызове для применения атрибута необходим оператор return.

Answer 5

Попробуйте

$('select option').each(function(index,item){ 
    if(index>0) 
    { 
     $(item).attr('level',index); 
    } 
}) 

Demo