Если писать на чистом JS, то можно использовать такой код:
HTML:
<select id="selectId" onchange="change()">
<option value="0">Select option</option>
<option value="1">text1</option>
<option value="2">text2</option>
<option value="3">text3</option>
</select>
JS:
var select, value, text;
function change() {
select = document.getElementById("selectId"); // Выбираем select по id
value = select.options[select.selectedIndex].value; // Значение value для выбранного option
text = select.options[select.selectedIndex].text; // Текстовое значение для выбранного option
alert("Value: " + value + "\nТекст: " + text); // Вывод алерта для проверки значений
}
Посмотреть пример
Но можно это же написать на jQuery
, мне этот вариант нравится больше:
HTML:
<select id="selectId">
<option value="0">Select option</option>
<option value="1">text1</option>
<option value="2">text2</option>
<option value="3">text3</option>
</select>
<p>Value: <span id="value">0</span></p>
<p>Text: <span id="text">Select option</span></p>
JS:
$(document).ready(function() {
$("#selectId").change(function() {
$("#value").text($(this).val());
$("#text").text($("#selectId option:selected").text());
});
});
Посмотреть пример на jQuery