Собственные атрибуты в select
 

Уважаемые!

Подскажите, пожалуйста, можно ли к select добавить собственные атрибуты?
Например, так:

<select name="delivery_type" id="delivery_type">
		<option value="0" price_delivery="0">Нет</option>
		<option value="1" price_delivery="1000">Автотранспорт</option>
		<option value="2" price_delivery="2000">Ж/Д транспорт</option>
</select>

А потом получать значения установленных атрибутов?

$('#delivery_type').attr('price_delivery')

Я попытался сделать и вывести в алерте при выборе в селекте:

onchange="alert($('#delivery_type').attr('price_delivery'))"

и оно выводит пустую строку.

Можно вообще так делать? И если можно, то как?

Спасибо!

onchange="alert($('#delivery_type :selected').attr('price_delivery'))"

И используй data-* атрибуты, они валидны в HTML5.

jsnb, спасибо!

Буду благодарен за пояснение - почему при событии onChange безусловно выдается значение для value и надо указывать выбранный selected для добавленных атрибутов?

Ну так уж селект устроен, что selectEl.value равно value выбранного option.
Если брать просто $('#delivery_type') то это jquery объект, который ссылается на сам элемент select, и attr будет искать атрибут именно в самом селекте. А т.к. там такого атрибута нет, то и выдаст пустую строку.
Указывая selected мы находим выбранный элемент option и уже от него берем атрибут через attr.

jsnb, Благодарю!